Потік

Потік веб-сторінки визначає порядок, у якому елементи відображаються вертикально та горизонтально. За замовчуванням елементи показуються у тому порядку, у якому вони розташовані в HTML-документі, зверху вниз. Горизонтальний потік зазвичай рухається зліва направо; однак у мовах із читанням справа наліво потік також змінюється на протилежний — справа наліво.

Кожен елемент у HTML є прямокутною областю, що займає позицію на рядку, подібно до слів на лінійованому аркуші. Існує два основних типи елементів: блочні та рядкові елементи.

Після аналізу прикладу можна зробити такий висновок:

Блочний елемент: займає всю ширину свого контейнера, незалежно від розміру вмісту. Блочні елементи розташовуються один під одним, послідовно.

Рядковий елемент: займає лише ту ширину, яка необхідна для його вмісту. Це дозволяє рядковим елементам розміщуватися на одному рядку. Вони переносяться на наступний рядок, якщо на поточному недостатньо місця.

Примітка

Властивість display для HTML-елементів визначена за стандартами та конвенціями, встановленими специфікацією HTML. Ці стандарти регулюють типове відображення елементів у різних веб-браузерах. Визначити тип будь-якого елемента можна у довідкових або специфікаційних посиланнях: HTML Reference та HTML Specification.

Типи елементів

Як вже зазначалося, кожен елемент у браузерній таблиці стилів має тип, що визначається властивістю display і впливає на його поведінку. Основні типи елементів — це блочні та рядкові елементи, а також існують додаткові типи, наприклад, inline-block елементи.

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

Блочні елементи: використовуються для визначення більших структур контенту, таких як заголовки, абзаци, списки та секції (наприклад, хедери, футери). Відображаються у вигляді прямокутних блоків, які вертикально розташовуються один над одним.