Родственные связи тегов в HTML

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

Рассмотрим для примера следующий код:

<ul> <li>paragraph <i>italic</i></li> <li>paragraph <i>italic</i></li> <li>paragraph <i>italic</i></li> <li>paragraph <i>italic</i></li> </ul>

В данном случае мы можем сказать, что теги i в этом коде являются потомками тегов li, а также являются потомками тега ul. При этом для каждого нашего тега i тег li является непосредственным родителем (отцом), а тег ul - дедушкой.

Что можно сказать про наши теги li? Они являются потомками тега ul и при этом сами являются родительскими для тегов i. Ну, а тег ul является родителем тегам li и тегам i. При этом для тегов li наш тег ul - непосредственный родитель.

Дан следующий код:

<ul> <li>text <a href="">link</a></li> <li>text <a href="">link</a></li> <li>text <a href="">link</a></li> <li>text <a href=""><b>bold link</b></a></li> </ul>

Расскажите какие родительские связи вы видите.

Дан следующий код:

<table> <tr> <td>cell 1</td> <td>cell 2</td> <td>cell 3</td> </tr> <tr> <td>cell 4</td> <td>cell 5</td> <td>cell 6</td> </tr> <tr> <td>cell 7</td> <td>cell 8</td> <td>cell 9</td> </tr> </table>

Расскажите какие родительские связи вы видите.

Дан следующий код:

<p> This is a paragraph with text <i><b>bold italic</b></i> <a href="">link <i>italic</i></a>. </p>

Какие потомки есть у абзаца? Какие непосредственные потомки есть у абзаца?

Дан следующий код:

<p> <a href="">link <i><b>bold italic</b></i></a> </p>

Расскажите, какие родители есть у тега b. Кто является его непосредственным родителем?



Чат с GPT Компилятор