div要素

div要素は特別な意味を持たず、内容となる子要素を表します。また、class属性、lang属性、およびtitle属性を使い、連続した要素のグループに共通のセマンティクスをマークアップすることができます。

なお、div要素は、他に適切な要素がないときなど、最後の手段の要素として見なすことが強く推奨されています。より適切な要素でマークアップすることは、読者にとってアクセシビリティの向上、作成者にとってはメンテナンス性の向上につながります。

たとえば、ブログの記事にはarticle要素、章にはsection要素、ページのナビゲーションにはnav要素、フォーム・コントロールのグループにはfildset要素などです。


一方で、div 要素は、スタイルを目的としたり、セクションの複数の段落を囲んで同じ方法で注釈を付けたりする場合には便利です。次の例では、個別に2つの段落の言語を指定するのではなく、一度に2つの段落の言語を指定する方法としてdiv要素を使用しています。

例)

<body>
<article lang="en-US">
<h1>My use of language and my cats</h1>
<p>My cat's behavior hasn't changed much since her absence, except that she plays her new physique to the neighbors regularly, in an attempt to get pets.</p>

<div lang="en-GB">
<p>My other cat, coloured black and white, is a sweetie. He followed us to the pool today, walking down the pavement with us. Yesterday he apparently visited our neighbours. I wonder if he recognises that their flat is a mirror image of ours.</p>
<p>Hm, I just noticed that in the last paragraph I used British English. But I'm supposed to write in American English. So I shouldn't say "pavement" or "flat" or "colour"...</p>
</div>

<p>I should say "sidewalk" and "apartment" and "color"!</p>
</article>
</body>

上記のHTMLドキュメント

カテゴリ
フロー・コンテンツパルパブル・コンテンツ
要素を使用することができる場所
フロー・コンテンツが使用できる場所。
コンテンツ モデル(内容に含めることのできる要素)
フロー・コンテンツ
コンテンツ属性
グローバル属性

この要素で廃止された属性
align属性は、CSSでより良い処理ができるため廃止されました。