Zagnieżdżanie elementów HTML polega na umieszczaniu jednego znacznika wewnątrz drugiego. Dzięki temu można łączyć różne efekty formatowania lub budować poprawną strukturę dokumentu.
Przykład z formatowaniem tekstu
<p>W tym <i>paragrafie <b>zobaczysz</b> sposoby formatowania</i> tekstu w HTML</p>
W tym przykładzie:
- element <p> tworzy akapit,
- element <i> nadaje kursywę fragmentowi: paragrafie zobaczysz sposoby formatowania,
- element <b> pogrubia tylko słowo zobaczysz,
- ponieważ <b> znajduje się wewnątrz <i>, słowo zobaczysz jest jednocześnie pogrubione i pochylone.
Poprawne domykanie znaczników
Znaczniki należy zamykać w odwrotnej kolejności niż zostały otwarte.
Poprawnie:
<i>tekst <b>ważny</b> dalej kursywą</i>
Niepoprawnie:
<i>tekst <b>ważny</i></b>
Niepoprawne zagnieżdżenie może prowadzić do błędnej interpretacji kodu przez przeglądarkę i trudności w stylowaniu strony.
Znaczenie na egzaminie
W zadaniach egzaminacyjnych trzeba dokładnie sprawdzać, od którego miejsca zaczyna się dany znacznik i gdzie się kończy. Formatowanie działa tylko na zawartość znajdującą się pomiędzy znacznikiem otwierającym i zamykającym.