Jeśli zdecydujesz się stworzyć stronę internetową, to bez językaznaczniki hipertekstowe HTML nie zajdziesz daleko. Oczywiście nadal istnieją CSS, PHP i inne języki skryptowe, bez których pełnowartościowa strona, jak ją kiedyś widziałeś, nie będzie działać. Są to jednak główne tagi HTML, które pozwolą ci położyć fundament pod swoją stronę.
Po otwarciu dowolnego dokumentu HTML lubstrona internetowa, widzisz ogromną liczbę różnych tagów. Jeśli jednak przyjrzysz się uważnie, większość z nich jest powtarzana, ponieważ opisują te same elementy. Na przykład główne tagi html obejmują tagi, takie jak typ dokumentu , ,
, ,i inne.
Aby wskazać typ bieżącego dokumentu, użyjElement . Przeglądarka potrzebuje go do rozpoznania sposobu interpretacji określonej strony internetowej. W zależności od używanej wersji HTML ten element będzie wyglądał inaczej. W HTML5 przyjmie następującą wartość:
Po tym, jak wskazałeś, jaki typodnosi się do twojego dokumentu, użyj znacznika . Podobnie jak większość innych tagów, jest sparowany, tzn. Ma tagi otwierające i zamykające. Różnica między nimi polega na tym, że przed zamykającym znacznikiem jest ukośnik „/”. Zatem najbardziej podstawowy tag HTML do tworzenia witryny będzie wyglądał następująco:
<html>
...
W takim przypadku reszta kodu zostanie umieszczona między otwierającymi i zamykającymi znacznikami, które będą otaczać całą zawartość strony internetowej.
Ten tag jest także głównym tagiem HTML.Jest napisany po , jest także sparowany i zawiera głównie metadane strony internetowej. Te dane nie są wyświetlane w widocznej części strony HTML (z wyjątkiem znacznika
Metadane
Główny tag witryny HTML, ponieważ to onZawiera wszystkie widoczne elementy strony - cały tekst, wszystkie zdjęcia i inne informacje. Zasadniczo, podobnie jak tag , jest pojemnikiem na inne tagi. Przykład:
Widoczna treść strony internetowej
Wszystkie powyższe tagi są podstawowetagi języka html. Istnieje jednak wiele innych elementów w hipertekstowym języku znaczników. Na przykład tagi akapitów i nagłówków. Pozwalają uporządkować tekst, podzielić go na osobne akapity i wyróżnić. Tak więc w przypadku akapitów używany jest znacznik <p>, jest to znacznik sparowany, pomiędzy otwierającym i zamykającym elementem, w którym znajduje się tekst. Przykład:
<p>
Tekst akapitu
p>
Oprócz akapitów mogą zawierać tekst.nagłówki. Zmieniają jednak również wygląd zawartego w nich tekstu, czyniąc go większym i pogrubionym. Istnieje 6 rodzajów nagłówków różniących się rozmiarem. Na przykład nagłówek <h1> jest największy, a nagłówek <h6> najmniejszy.
Żadna strona nie jest kompletna bez obrazów,zdjęcia i fotografie. W końcu bez tego strony internetowe byłyby suchym tekstem, nieciekawym do studiowania. Aby wstawić dowolny obraz na stronie, używa się tagu <img> w hipertekstowym języku znaczników. Ważne jest, aby pamiętać, że ten tag nie jest sparowany, więc zostanie zapisany w kodzie jako <img />.
Często oprócz tekstu i różnych obrazów,strony wykorzystują linki. Mogą przekierowywać do zasobu strony trzeciej lub na inną stronę w Twojej witrynie. Aby wskazać obecność linku, używany jest znacznik <a>.
Dowiedzieliśmy się trochę o głównych tagach.Jednak większość tagów ma również atrybuty. Są zapisane w elemencie otwierającym i składają się z dwóch części. Pierwsza to nazwa samego atrybutu, druga to wartość tego atrybutu, która jest zapisywana po znaku „=” i jest ujęta w cudzysłów.
Wiele tagów ma atrybuty.Jednak w przypadku niektórych tagów są one opcjonalne, chyba że chcesz w jakikolwiek sposób zmodyfikować elementy. W przypadku innych znaczników wymagana jest obecność atrybutów, takich jak np. znacznik <a> (do tworzenia hiperłączy) oraz znacznik <img /> (do dodawania zdjęć do strony). Chodzi o to, że jeśli nie określimy atrybutów i ich wartości dla tych głównych tagów html, to nie zobaczymy ich na stronie serwisu.
Jeśli określisz w kodzie tekst zawarty w tagu<a>, wtedy nie zobaczysz na stronie niczego poza tym tekstem. Sam tag w rzeczywistości mówi tylko o zamiarze utworzenia hiperłącza, a aby go faktycznie utworzyć, potrzebujesz atrybutu. Tym atrybutem będzie href, a wartością tego atrybutu będzie konkretny link do zasobu. Tak więc, jeśli chcemy utworzyć link do strony fb.ru, będzie to wyglądać tak:
<a href="fb.ru"> Link do fb.ru </a>
Tak więc cały tekst, który znajduje się pomiędzy znacznikami <a> jest hiperłączem, a wartość atrybutu href ujęta w podwójne cudzysłowy będzie adresem, do którego przejdziemy klikając w tekst.
Podobnie jest z tagiem <img />.Jeśli nie określimy atrybutu i jego wartości wraz z nim, to obrazki nie pojawią się na stronie. Podobnie jak w przypadku tagu <a>, obecność tagu <img /> mówi tylko o tym, że wstawimy zdjęcie do naszego kodu. Jednak, aby ten obraz się pojawił, musisz podać adres tego obrazu. Do tych celów będziesz musiał użyć atrybutu src, którego wartością będzie adres obrazu znajdującego się w zasobie strony trzeciej lub na twoim komputerze.
<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg />
Ponadto tag <img /> ma jeszcze jedenatrybut. Nie jest uważany za obowiązkowy, ale jest uznawany za zalecany do użytku. Ten atrybut jest atrybutem tekstu alternatywnego. Wartością tego atrybutu będzie tekst odpowiadający opisowi zdjęcia lub obrazu. Ten tekst zostanie wyświetlony w przypadku, gdy obraz z jakiegokolwiek powodu nie zostanie załadowany. Ponadto użycie tego atrybutu pomoże osobom niedowidzącym, które korzystają z czytników ekranu. Zatem tag <img /> wraz z dwoma prezentowanymi atrybutami będzie wyglądał tak:
<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg
alt = "opis obrazu" />
Istnieje ogromna liczba atrybutów, onelista jest tak duża, jak lista głównych tagów HTML. Istnieje jednak atrybut, który jest nieodłączny od wielu tagów jednocześnie. To jest wyrównane. Może być używany ze znacznikiem <img /> oraz ze znacznikiem <p>. Jego istotą jest to, że ustala pozycję obrazu lub tekstu na stronie. Najbardziej podstawowe wartości tego atrybutu to prawo i lewo, które oznaczają odpowiednio wyrównanie do prawej i do lewej. Jeśli zastosujesz go do obrazu, kod będzie wyglądał tak:
<img src = https: //img.fonwall.ru/o/f7/zakat-more-palmy-plyazh-q85n.jpg
alt = "opis obrazu"
align = "w prawo" />
Należy jednak zauważyć, że ostatnioniektóre z tych atrybutów nie są używane, a zamiast nich używane są kaskadowe arkusze stylów (CSS). Aby używać stylów w html, pisany jest znacznik <link>, który służy do łączenia stylów i znajduje się w znaczniku <body>.