Блоковий елемент div в html

Блоковий елемент div в html

Використання елемента div

При побудові HTML-розмітки часто виникає потреба обернути кілька елементів в єдиний блок. Елементи, що входять в такі конструкції, відповідно до рівня вкладеності, називаються дочірніми і батьківськими. Батько також може бути позначений словом «контейнер». Найпоширенішими випадками використання таких контейнерів є:

  • Поділ сторінки на ділянки з однорідним вмістом.
  • Завдання різного стильового оформлення для вмісту.
  • Необхідно поліпшити сприйняття складеної розмітки.

Для задоволення такої потреби в HTML існує універсальний блоковий елемент

. Він, як і інші блокові елементи, займає всю доступну ширину і висоту, а також розташовується з нового рядка. Відмінною рисою елемента
є те, що браузер відображає його без візуальної стилізації. Тому він є ідеальним контейнером.

замітка
На перший погляд цінність блочного елемента

хоч я знаю. Повною мірою вона розкривається з використанням технології каскадних стилів (скор. CSS). Можна задати елементу
атрибути id або class. на які повісити певні стилі: колір заднього фону, вирівнювання на сторінці, зробити його видимим або прихованим, і багато іншого. Маніпуляція з властивостями відображення контейнера буде впливати і на елементи, розташовані всередині нього.

Приклад структури сторінки

У прикладі, представленому нижче, кожного контейнера

задані атрибути id зі значенням характеризує їх роль на сторінці. обов'язковий елемент містить блок