Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Элемент разделения контента HTML (<div>) является базовым контейнером для элементов основного потока ( flow content ). Он не влияет на контент или формат пока не стилизован, используя CSS. Являясь "чистым" контейнером, элемент <div> по своему существу не представляет ничего. Между тем, он используется для группировки контента, что позволяет легко его стилизовать, используя class или id атрибуты, помечая секцию документа, написанную на разных языках (используя атрибут lang), и так далее.

Категории контента Flow content, palpable content.
Разрешённый контент Flow content.
Или (в WHATWG HTML): Если родитель является элементом <dl>: один или несколько элементов <dt>, сопровождаемый одним или более <dd> элементами, в ряде случаев смешанный с <script> и <template> элементами.
Опускание тэгов Нет. Открывающий и закрывающий тэг являются обязательными.
Разрешённые родители Любой элемент, который разрешает flow content.
Или (в WHATWG HTML): <dl> элемент.
Разрешённые ARIA-роли Любые
DOM интерфейс HTMLDivElement

Атрибуты

Этот элемент включает глобальные атрибуты.

Атрибут align является устаревшим; не используйте его больше. Вместо, вам следует использовать CSS свойства или техники, такие как CSS Grid или CSS Flexbox для выравнивания и изменения положения <div> элементов на странице.

Указания по променению

  • Элемент <div> следует использовать только в том случае, если никакой другой семантический элемент (такой как <article> или <nav>) не подходит.

Примеры

Простой пример

<div>
  <p>Any kind of content here. Such as
  &lt;p&gt;, &lt;table&gt;. You name it!</p>
</div> 

Результат будет выглядеть так:

Стилизованный пример

Этот пример создаёт прямоугольник с тенью, применяя стили к  <div> используя CSS. Заметьте, тчо использование атрибута class на элементе <div> даёт применение стилей "shadowbox" к элементу.

HTML

<div class="shadowbox">
  <p>Here's a very interesting note displayed in a
  lovely shadowed box.</p>
</div>

CSS

.shadowbox {
  width: 15em;
  border: 1px solid #333;
  box-shadow: 8px 8px 5px #444;
  padding: 8px 12px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
}

Результат

Спецификации

Спецификация Статус Примечание
HTML Living Standard
Определение '<div>' в этой спецификации.
Живой стандарт С последнего снапшота изменений нет
HTML5
Определение '<div>' в этой спецификации.
Рекомендация Устарело: align
HTML 4.01 Specification
Определение '<div>' в этой спецификации.
Рекомендация  

Браузерная совместимость

ВозможностьChromeEdgeFirefoxInternet ExplorerOperaSafari
Базовая поддержка Да Да1 Да Да Да
align Да Да1 Да Да Да
ВозможностьAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Базовая поддержка Да Да Да4 Да Да Да
align Да Да Да4 Да Да Да

Смотрите также

Метки документа и участники

 Внесли вклад в эту страницу: kayablue, vocasle
 Обновлялась последний раз: kayablue,