仕様

DIV要素は、
何も表しません。

div汎用コンテナ (generic language/style container)
カテゴリ
  • フローコンテンツ
  • パルパブルコンテンツ
種類通常要素
この要素を
使用できる
状態		フローコンテンツを受け入れる要素。
dl要素の子要素として。
許可されて
いる内容		フローコンテンツ。dl要素の子要素の場合は、 1つ以上の dt要素とそれに続く1つ以上の dd要素で構成されるグループ。オプションで、スクリプトをサポートする要素と混合されます。
属性グローバル属性のみ
text / html
での
タグの省略		省略できません。
許可されて
いるARIA		任意。
[既定値 : なし]
DOM
インター
フェイス
HTMLDivElement
  1. [Exposed=Window]
  2. interface HTMLDivElement : HTMLElement {
  3. [HTMLConstructor] constructor();
  4.  
  5. };
レンダリング
フローコンテンツ
  1. p {
  2. display: block;
  3. unicode-bidi: isolate;
  4. unicode-bidi: bidi-override;
  5. }

CSS を大雑把に読むと、 フローレイアウトに配置されたときにブロックレベルのボックスを生成します。 ブロック方向の前後(上下)の余白を１文字分空けます。 などになります。

参加
コンテキスト		ブロックフォーマットコンテキスト
確立
コンテキスト		ブロックフォーマットコンテキスト
div要素は、特別な意味はありません。

div要素には特別な意味はありません。 それはその子供たちを表しています。 これをclass、lang、およびtitle属性とともに使用して、連続する要素のグループに共通のセマンティクスをマークアップできます。 dl要素で使用して、dt要素とdd要素のグループをラップすることもできます。

  1. <div>
  2. <div>
  3. <span>Text</span>
  4. <span>Text</span>
  5. </div>
  6. </div>
Text Text
参照元
  1. HTML Living Standard. 4.4.15 The div element
  2. HTML Living Standard. 15 Rendering 15.3.3 Flow content
  3. HTML 5.2 W3C 勧告. 4.4.15 The div element
  4. HTML 4.01 Specification W3C 勧告. 7.5.4 Grouping elements: the DIV and SPAN elements
  5. MDN Web Docs. HTML <div>: コンテンツ分割要素

使用可能な箇所

フローコンテンツを
受け入れる要素に
配置できます。

div要素は、フローコンテンツを受け入れる要素に配置できます。
dl要素の子要素として配置できます。

  1. <section>
  2. <div>text</div>
  3. </section>

フローコンテンツを配置できる section要素のコンテンツの一部として、div要素を配置できます。

text
  1. <dl>
  2. <div>
  3. <dt>Title10</dt>
  4. <dd>Data11</dd>
  5. <dd>Data12</dd>
  6. </div>
  7. <div>
  8. <dt>Title20</dt>
  9. <dd>Data21</dd>
  10. </div>
  11. </dl>

dl要素のコンテンツの一部として div要素を配置する事ができます。

Title10
Data11
Data12
Title20
Data21

配置できるコンテンツ

フローコンテンツを
配置できます。

div要素は、フローコンテンツを受け入れる要素に配置された場合は、フローコンテンツを配置できます。dl要素の子要素の場合は、 1つ以上の dt要素とそれに続く1つ以上の dd要素で構成されるグループを配置できます。 オプションで、スクリプトをサポートする要素と混合されます。

  1. <div>
  2. <section>text</section>
  3. </div>

div要素のコンテンツの一部として、フローコンテンツである section要素を配置できます。

text
  1. <dl>
  2. <div>
  3. <dt>Title10</dt>
  4. <dd>Data11</dd>
  5. <dd>Data12</dd>
  6. </div>
  7. <div>
  8. <dt>Title20</dt>
  9. <dd>Data21</dd>
  10. </div>
  11. </dl>

dl要素の子要素としての div要素のコンテンツの一部として dt要素, dd要素を配置できます。

Title10
Data11
Data12
Title20
Data21

属性

グローバル属性のみ、
設定できます。

figcaption要素は、グローバル属性のみ 設定できます。

気を付ける点