Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Поговорим о вложениях

.

Вы уже знаете, что элементы div могут содержать абзацы, но, кроме этого, они могут включать в себя и какое-то количество других элементов div. Тогда они называются вложенными (nested) div-элементами. Один div просто вкладывается в другой. Только не забывайте закрывать теги. Вложенные элементы div могут помочь логически сгруппировать разделы веб-страницы, как вы можете, к примеру, положить несколько маленьких коробок с похожим содержимым внутрь одной большой.

В качестве примера возьмите следующий код; посмотрите, как мы вложили элементы div и р в другой элемент di v с id = outer (внешний). Значения id помогают понять иерархию элементов.

Как показано на рис. 2.19, некоторые элементы di v вложены — элементы с id-атрибутами site branding и tagline вложены внутрь элемента dive атрибутом header.

Структурированная страница: все поделено!

Если все хорошо, то ваш HTML-код должен выглядеть так.

Обратите внимание, что в разметке выше после некоторых закрывающих тегов добавлены комментарии. Они необязательны, но, повторюсь, комментирование — отличная привычка, предупреждающая появление проблем впоследствии. Часто невозможно найти соответствующие друг другу открывающие и закрывающие теги div в больших блоках HTML. Если у вас несколько вложенных тегов div, то в конце разметки должно быть что-то вроде этого:

В таких случаях будет трудно понять, какой закрывающий тег что закрывает. Пока вам может быть не совсем понятно, почему это так важно, но когда мы начнем изучать CSS, ошибки в HTML-коде будут очень сильно портить вам жизнь. Добавив несколько комментариев, можно значительно упростить себе работу по отладке в дальнейшем.

Как выглядит веб-страница? Я не буду приводить тут скриншот, так как добавление div-элементов никак не проявляется при отображении. Изменения, которые мы сделали, касаются структуры документа, по-настоящему они понадобятся нам позднее.

.

Читайте так же:
Not found