Вложенность тегов html

Если внутри какого либо тега используется еще один или даже несколько других — это называется вложенность тегов html.

Давайте еще раз взглянем на размещенную часть кода html в листинге 1.2Вложенный тег

В данном примере мы видим, что <strong> размещен внутри <p> и является составляющей абзаца. В то же время <p> находится внутри <body>. Такое вложение тегов html считается обычным явлением при написании html-кода.

Под влиянием тега <strong> слово "HTML" выделено полужирным шрифтом, но все так же остается частью абзаца <p>.

Давайте рассмотрим еще один пример:

<p>Добро пожаловать на сайт по изучению<em><strong>языка html</strong></em></p>

В этом абзаце мы выделили "языка html" курсивом, да еще и полужирным шрифтом. И обратите внимание: в этом примере <strong> вложен в тег <em>. А если прописать наоборот? Вложить <em> в тег <strong>. А никаких изменений не произойдет. Можете поэкспериментировать. Здесь нет приоритета тегов.

Далее нам надо усвоить еще одно правило написания тегов html. Очередность проставления закрывающих тегов. Иными словами — вложенный тег (и открывающий и закрывающий) должны быть внутри родительского тега.

В настоящее время браузеры научились исправлять мелкие опечатки в html-коде, но только мелкие. В противном случае страница может отобразиться не корректно.

Тег, в котором непосредственно размещен другой тег, называют родительским (родителем) для данного тега, а вложенный тег называют дочерним (потомком).

Каждый тег может иметь довольно много дочерних, а вот родительский лишь один.

Количество тегов, в которые последовательно вложен тот или иной тег, называют уровень вложенности. У некоторых страниц уровень вложенности отдельных тегов может достигать нескольких десятков.

Для более удобного чтения html-кода в нем отмечают уровень вложенности, проставляя отступ конкретного тега от левого края (листинг 1.3).

Вложенность тегов html

Взглянув на этот фрагмент html-кода видим, что <p> и <h1> являются вложенными в <body>.