| Меню сайта |
|
 |
| Реклама |
 |
|
|
 | |  |
|
Oснова создания web-страниц
|
|
Вложенность тегов html
Вложенность тегов html - это когда внутри одного тега html размешаются один или несколько других тегов.
Если мы посмотрим на приведенный в листинге 1.2 фрагмент HTML-кода, то заметим, что одни теги html вложены в другие. Тег <strong> вложен в тег <p>, являясь частью его содержимого.
Так-же тег <p>, в свою очередь, вложен в тег <body>, а тот — в "глобальный" тег <html>. (Теги <body> и <html> мы рассмотрим чуть позже.) Такая вложенность тегов HTML — обычное явление.
Когда Web-обозреватель встречает тег html, вложенный в другой тег, он как бы накладывает действие "внутреннего" тега на эффект "внешнего". Так, действие тега <strong> будет наложено на действие тега <p>, и фрагмент абзаца окажется выделенным полужирным шрифтом, при этом оставаясь частью этого абзаца.
Давайте для примера текст "Web-дизайн", который мы недавно поместили в тег html <em>, заключим еще и в тег <strong>.
Пример:
<p>Приветствуем на нашем Web-сайте всех, кто занимается
<em><strong>Web-дизайном</strong></em>! Здесь вы сможете найти много полезной информации.</p>
В этом случае данный текст будет выделен полужирным курсивом. Иными слова-ми, действие тега <strong> будет наложено на действие тега <em>
Порядок следования закрывающих тегов должен быть обратным тому, в котором следуют теги открывающие. Говоря иначе, теги со всем их содержимым должны полностью вкладываться в другие теги, не оставляя "хвостов" снаружи.
Если же мы нарушим это правило и напишем такой HTML-код (обратите внимание на специально перепутанный порядок следования открывающих тегов).
Пример:
<p>Приветствуем на нашем Web-сайте всех, кто занимается
<em><strong>Web-дизайном</em></strong>! Здесь вы сможете найти много полезной информации.</p>
Web-обозреватель может отобразить нашу Web-страницу неправильно.
На заметку
Нужно сказать, что современные Web-обозреватели "умеют" исправлять мелкие ошибки Web-дизайнера. Но именно мелкие!
Осталось выучить несколько новых терминов. Тег html, в который непосредственно вложен данный тег, называется родительским, или родителем. В свою очередь, тег html, вложенный в данный тег, называется дочерним, или потомком. Так, для тега <em> в приведенном далее примере тег <p> — родительский, а тег <strong> — дочерний. Любой тег html может иметь сколько угодно дочерних тегов, но только один родительский (что, впрочем, понятно — не может же он быть непосредственно вложен одновременно в два тега).
Элемент Web-страницы, в который вложен элемент, создаваемый данным тегом, называется родительским, или родителем. А элемент Web-страницы, который вложен в данный элемент, — дочерним, или потомком. То же самое, что и в случае тегов.
Уровень вложенности того или иного тега html показывает количество тегов, в которые он последовательно вложен. Если принять за точку отсчета тег <p>, то тег <em> будет иметь первый уровень вложенности, т. к. он вложен непосредственно в тег <p>. Тег <strong> же будет иметь второй уровень вложенности, поскольку он вложен в тег <em>, а тот, в свою очередь, — в тег <p>. В сложных же Web-страницах уровень вложенности иных тегов html может составлять несколько десятков.
Уровень вложенности тегов в HTML-коде обозначают с помощью отступов, которые ставят слева от соответствующего тега и создают с помощью пробелов (листинг 1.3). На отображение Web-страницы они никак не влияют.
Листинг 1.3
<body>
<h1>Справочник по HTML</h1>
<p>Приветствуем на нашем Web-сайте, всех тех, кто занимается
сайтостроением
и Web-дизайном.
Здесь вы сможете найти информацию обо всех интернет-технологиях,
применяемых в создании сайта. В частности, о языке <strong>HTML</strong></p>
</body>
Здесь сразу видно, что теги <h1> и <p> вложены в тег <body>, — видно по отступам.
 
|
|
|
|
|
| |
 | |  |
|
| Заработай сейчас! |
 |
|
| Навигация по сайту |
|
|
| Поиск по сайту |
|
|
|
