Блочные элементы HTML5 — полный список

Блочные элементы html (block elements) отображаются как прямоугольник и занимают всю доступную им ширину. Высота блочных элементов зависит от их содержимого.

В начале и конце блочных элементов в html (<div>, <h1>-<h6>, <p> и другие) идет перевод на новую строку. На странице это будет выглядеть как абзац.

Это отличается от строчных элементов html (<span>, <a>) — которые будут отобраться последовательно друг за другом, в одну строку.

Список блочных элементов html

* отмечены блочные элементы, появившиеся в HTML5

Селектор Использование Селектор Использование
article* Содержимое статьи header* Заголовок страницы или секции
aside* Aside Content hgroup* Groups Header Information
blockquote Цитирование hr Горизонтальная линия
body Содержимое страницы li Элемент списка
br Перевод на новую строку (разрыв строки) map Image Map
button Кнопка object Встроенный объект
canvas* Область для рисования ol Нумерованный список
caption Заголовок таблицы output* Form Output
col Столбец таблицы p Абзац
colgroup Группа столбцов таблицы pre Отформатированный текст
dd Описание термина progress* Отображение прогресса выполняемой задачи
div Блок section* Раздел страницы
dl Список терминов table Таблица
dt Термин (определение) tbody Содержимое таблицы
embed Внешний контент (встроенный элемент) textarea Область для ввода текста в форме
fieldset Fieldset Label tfoot Нижняя часть таблицы
figcaption* Figure Caption th Строка заголовока таблицы
figure* Groups Media Content and Caption thead Загололовок таблицы
footer* Нижняя часть страницы или секции tr Строка таблицы
form Форма для ввода данных ul Ненумерованный список
h1–6 Заголовок (уровня 1–6) video* Видео плейер

Виды HTML элементов

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

Все элементы HTML разделяются на две категории:

Блочные элементы HTML5 — полный список: 1 комментарий

  1. Чисто теоритически, можно себя как то успокоить мыслью что больше нету блочных и инлайновых, что бы сильно не тревожится о разноглассии терминологий. Но практически, прочитыв и осознав суть статьи, ничего ведь не поменяеться, будем использовать те же ресеты и делать нативно блочные элементы инлайновыми, как раньше.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *