div 要素フロー・コンテンツをまとめる

div 要素はフロー・コンテンツをまとめます。div 要素自体は特別な意味を持ちませんが、class 属性、lang 属性、title 属性などを付与して、内包するフロー・コンテンツに対する意味づけを行うことができます。

div 要素は、他に適切な要素がない場合にのみ使用すべきです。例えば、記事をマークアップするのであれば、article 要素を使用できますし、セクションであれば、section 要素、ヘッダーであれば header 要素、ナビゲーションであれば nav 要素などがそれぞれあります。まずは適切な要素選択をした上で、div 要素によるグルーピングが必要であれば使用します。

サンプルソースを見る

div 要素の仕様

カテゴリ
コンテンツモデル
この要素を使用できる文脈

フロー・コンテンツが期待される場所

この要素で使用できる属性
DOM インタフェース
interface HTMLDivElement : HTMLElement {};

div 要素のサンプルソース

<!-- 記事内で英語による文章を挿入した場合などにその部分をまとめた例 -->
<article>
 <h1>英語での表現について</h1>
 <p>
  私は昨日、考えたんだが、日本語で書いた文章を…
 </p>
 <p>
  さて、ここまで書いてきたことを英語で表現するにはどうすればいいか。
  まずは単純に翻訳してみたものを下記に示してみよう。
 </p>
 <div lang="en">
  <p>English Text…</p>
  <p>English Text…</p>
  <p>English Text…</p>
 </div>
 <p>
  このままだとちょっとわかりにくい英語になっているかもしれない…
 </p>

W3C HTML5 仕様書

4.5.13 The div element