Группировка текста и элементов в блок

Элемент <div> (от английского «division» — отдел, часть, группа ) позволяет сгруппировать несколько элементов в единый блок. Например, вы можете создать <div>, объединяющий в себе все элементы заголовка сайта (логотип и панель навигации). Вы также можете создать <div> для объединения комментариев посетителей сайта. В браузере содержимое элемента <div> будет отображено с новой строки, никаких других изменений внешнего вида не произойдет. Однако с помощью атрибутов id и class вы можете создать правило CSS, определяющее, сколько места будет занимать элемент <div> на экране, а также изменить внешний вид всех элементов, содержащихся в нем.

Кроме того, разобраться в вашем коде будет гораздо проще, если каждый раздел страницы вы заключите в отдельный элемент <div>.

Так как внутри <div> может находиться несколько других элементов, комментарии после закрывающего тега </div> бывают очень полезны. Это позволит вам четко видеть, к чему относится открывающий тег, как показано в последней строке примера.

<div id="header">
  <img alt="Electric Universe" src="images/logo.png">

  <ul>
    <li><a href="index.html">Главная</a></li>

    <li><a href="biography.html">Биография</a></li>

    <li><a href="works.html">Дискография</a></li>

    <li><a href="contact.html">Контакты</a></li>
  </ul>
</div><!-- конец заголовка -->