div 要素

4.5.13 div 要素

カテゴリー
フロー・コンテンツ
formatBlock 候補
この要素を使うことができるコンテキスト:
フロー・コンテンツが期待される場所
コンテンツ・モデル:
フロー・コンテンツ
コンテンツ属性:
グローバル属性
DOMインタフェース:
interface HTMLDivElement : HTMLElement {};

div 要素は、特別な意味を全く持ちません。これは、その子を表すことになります。class, lang, title 属性を使って、一貫した要素のグループに共通のセマンティクスをマークアップすることができます。

ウェブ制作者は、 div 要素を、他に適切な要素がないときなど、最後の手段の要素として見なすことが、強く推奨されます。もっと適切な要素があるのに div 要素を使うと、読者にとってアクセシビリティが貧弱になってしまい、ウェブ制作者にとってはメンテナンス性が貧弱になってしまいます。

例えば、ブログ投稿には article を使って、章には section を使って、ページのナビゲーションには nav を使って、フォーム・コントロールのグループには fieldset を使ってマークアップするのが良いでしょう。

一方で、div 要素は、スタイルを目的としたり、セクションの中で、類似の方法で注釈を付けたい複数の段落を囲むには、便利かもしれません。次では、一度に2つの段落の言語をセットする方法として div 要素を使う例をご覧いただきます。2つの段落要素を分離して言語をセットします:

<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>

※ 原文:http://www.w3.org/TR/2011/WD-html5-20110525/grouping-content.html#the-div-element