2.1 Wprowadzenie do tagów

HTML-documentsZnaczniki są oparte na tagach . Co to jest tag ?

Tagi zostały wynalezione w latach 70., aby ludzie mogli dodawać informacje o usługach do dokumentów dla programów przetwarzających te dokumenty.

Tag- jest to kluczowe (funkcjonalne) słowo, najczęściej w języku angielskim, które zostało ujęte w nawiasy ostre (więcej i mniej znaków), aby programy nie myliły tagów i zwykłych słów w języku angielskim.

Znacznik może również zawierać różne informacje o usługach, które mogą być przydatne dla programu przetwarzającego dokument.

Przykładowy tekst ze znacznikiem:


 <a href="http://codegym.cc/about">
    Link to something interesting
</a>

W tym przykładzie widzimy tekst, znacznik „a”, a także informacje o usłudze – atrybuty znacznika. Poniżej dowiesz się o nich więcej.

2.2 Rodzaje tagów: otwierający, zamykający, pusty

Tagi są różnego rodzaju. Po pierwsze, są pojedyncze i podwójne. Najczęstsze są sparowane tagi . I jak już pewnie się domyślacie, zawsze chodzą parami. Nazywa się je również otwieraniem i zamykaniem.

Znacznik otwierający to po prostu słowo kluczowe w nawiasach trójkątnych. Przykład:

<h1>

Znacznik zamykający jest podobny do znacznika otwierającego, ale słowo kluczowe jest poprzedzone ukośnikiem. Przykład:

</h1>

Znacznik otwierający może zawierać informacje o usłudze - atrybuty, tag zamykający - nie . Znacznik początkowy jest zawsze pierwszym z pary. Znacznik zamykający NIE może znajdować się najpierw w tekście, a potem znacznik otwierający. To HTML-documentnie będzie ważne.

Pojedyncze znaczniki nie mają znacznika zamykającego. Listę takich tagów definiuje HTML-standard. Przykłady takich tagów:

  • <br>- przerwanie linii;
  • <img>- zdjęcie.

Nawiasem mówiąc, sparowany tag, jeśli nie zawiera informacji w środku, można zapisać w formie skróconej . Przykład:

<h1/>

To nie jest pojedynczy tag, ale pusty tag w parze. To tak, jakby jednocześnie były zamknięte i otwarte tagi. Różni się od zamkniętego znacznika tym, że ukośnik znajduje się na końcu (przed drugim nawiasem trójkątnym).

2.3 Drzewo znaczników

I jeszcze ważna informacja o sparowanych tagach. W dokumencie może ich być wiele i mogą być zagnieżdżane. Co to znaczy? Oznacza to, że dowolny tekst w obrębie HTML-documentmoże być otoczony znacznikami, nawet jeśli zawiera inne znaczniki. Przykład:


<html>
    plain text
        <a href="http://codegym.cc/about">
            Link to something interesting
          </a>
     some other text
</html>

Z grubsza mówiąc, w tekście HTML może wystąpić sekwencja tagów:

<h1> <h2> </h2> </h1>

Ale nie może być:

<h1> <h2> </h1> </h2>

Jeśli znacznik początkowy <h2>znajduje się w <h1>parze -znaczników, to odpowiadający mu znacznik końcowy </h2>również musi znajdować się w <h1>parze -znaczników.

W ten sposób wszystkie znaczniki dokumentów tworzą rodzaj drzewa znaczników . Najpierw jest znacznik najwyższego poziomu, który opakowuje cały dokument, zwykle nazywany <html>, zawiera pary znaczników podrzędnych, mają one własne i tak dalej.

W rzeczywistości program, który przetwarza dokument ze znacznikami, widzi go dokładnie w ten sposób — jako drzewo znaczników z tekstem w środku.

2.4 Atrybuty

Informacje o tagach nie byłyby kompletne, gdybyśmy nie mówili o atrybutach. Pojedyncze tagi i tagi początkowe sparowanych tagów mogą mieć . Atrybuty te zawierają przydatne informacje o zawartości znacznika.

Znacznik może zawierać kilka atrybutów, które mają następującą ogólną postać:


        <tag name1="value1" name2="value2">
    

Każdy atrybut jest określony jako para Namei meaning. Może istnieć dowolna liczba atrybutów.

Ale doświadczony programista od razu zada pytanie: co zrobić, jeśli jako wartość atrybutu musisz użyć tekstu zawierającego znaki «<»lub «>»cudzysłowy ?

Nazwa symbolu Symbol Wpis HTML
podwójny cudzysłów " "
Ampersand & &
Mniej niż symbol < <
Więcej symbolu > >
Przestrzeń  
pojedynczy cytat ' '