#?SuikaWiki/0.9
* div 要素型 (HTML, XHTML 1)

[4] [CODE(HTMLe)[div]] 要素型は、 [CODE(HTMLa)[[[class]]]]
属性や [CODE(HTMLa)[id]] 属性と併用することで、
[[文書]]に[[構造]]を与えるための一般的な仕組みとして用意されました。

[CODE(HTMLe)[div]] は[[ブロック水準要素]]ではありますが、
それ以外に[[表現]]上の制約はありません。
[[著者]]は、[[スタイルシート]]や [CODE(HTMLa)[[[lang]]]]
属性を使って要求を満たすことができます。
(<IW:HTML4:"struct/global.html#edef-DIV"> を参照されたし。)

[5] 
: [[開始タグ]]: 必須
: [[終了タグ]]: 必須
: [[内容モデル]]: [CODE(SGML)[(%[[flow]];)*]]
: [[属性]] :
,[CODE(HTMLa)[[[align]]]]   ,,,             ,[HTML4] [[非推奨]]
,[CODE(HTMLa)[[[class]]]]   ,,,[[級]]       ,[HTML4] %[[coreattr]]
,[CODE(HTMLa)[[[datafld]]]  ,,,欄名         ,[HTML4] 予約
,[CODE(HTMLa)[[[dataformat]]],,,データ書式  ,[HTML4] 予約
,[CODE(HTMLa)[[[datasrc]]]  ,,,データ源     ,[HTML4] 予約
,[CODE(HTMLa)[[[dir]]]]     ,,,[[書字方向]] ,[HTML4] %[[i18n]]
,[CODE(HTMLa)[[[id]]]]      ,,,一意識別子   ,[HTML4] %coreattr
,[CODE(HTMLa)[[[lang]]]]    ,,,[[自然言語]] ,[HTML4] %i18n
,[CODE(HTMLa)[[[xml]]:lang]],,,自然言語     ,[XHTML1]
,[CODE(HTMLa)[[[onclick]]]] ,,,             ,[HTML4] %[[events]]
,[CODE(HTMLa)[[[ondblclick]]]],,,           ,[HTML4] %events
,[CODE(HTMLa)[[[onkeydown]]]],,,            ,[HTML4] %events
,[CODE(HTMLa)[[[onkeypress]]]],,,           ,[HTML4] %events
,[CODE(HTMLa)[[[onkeyup]]]] ,,,             ,[HTML4] %events
,[CODE(HTMLa)[[[onmousedown]]]],,,          ,[HTML4] %events
,[CODE(HTMLa)[[[onmouseout]]]],,,           ,[HTML4] %events
,[CODE(HTMLa)[[[onmouseover]]]],,,          ,[HTML4] %events
,[CODE(HTMLa)[[[onmouseup]]]],,,            ,[HTML4] %events
,[CODE(HTMLa)[[[style]]]]   ,,,スタイル情報 ,[HTML4] %coreattr
,[CODE(HTMLa)[[[title]]]]   ,,,注釈的題     ,[HTML4] %coreattr

[[#comment]]

** レンダリング

[7] HTML 4 仕様書は、視覚的[[利用者エージェント]]の通常のレンダリング例として、次のものを挙げています。

[PRE[
<P>aaaaaaaaa<DIV>bbbbbbbbb</DIV><DIV>ccccc<P>ccccc</DIV>
]PRE]
を表示すると、
[PRE[
aaaaaaaaa
bbbbbbbbb
ccccc

ccccc
]PRE]

つまり、 [[CSS]] で表現すると、
[PRE[
div {
  display: block;
}
]PRE]

[8] 非推奨の [CODE(HTMLa)[align]] 属性対応の UA
は、[[既定スタイル]]として
[PRE[
div[align] {
  text-align: [VAR[attr(align)]];
}
]PRE]
を持つと考えられます。

[9] 
[PRE[
<div align="center">
  <table/>
</div>
]PRE]
だと表は真ん中に表示されるのでしょうか。 HTML 4
はその辺にちゃんと言及していないような気がしますが。

[[#comment]]

** メモ

[1] [[yuu]] は単純に [CODE(HTMLe)[div]] が嫌いなんじゃないかと思った。

[2] [[WinIE]] は、3未満が
[CODE(HTMLe)[div]]
要素型に対応していません。
(タグを無視するので [CODE(CSS)[[[display]]: [[inline]]]] になります。)

[3] [[NN]] は、 2 で既に対応していて
[CODE(CSS)[display: [[block]]]]
になります。 (1 では未確認。)
(独自拡張の [CODE(HTMLa)[[[align]]]] 属性を使うと、文字揃え位置を変更できます。)

[[#comment]]

** 例

[6] 次の例は、 HTML 4 仕様書にあるもので、
顧客データベースに基づく HTML 文書において、 HTML 4
に存在しない「顧客」という情報をマーク付けするために
[CODE(HTMLe)[div]] を用いています。

[PRE[
<DIV id="client-boyera" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Boyera</TR>
<TR><TH>First name:<TD>Stephane</TR>
<TR><TH>Tel:<TD>(212) 555-1212</TR>
<TR><TH>Email:<TD>sb@foo.org</TR>
</TABLE>
</DIV>

<DIV id="client-lafon" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Lafon</TR>
<TR><TH>First name:<TD>Yves</TR>
<TR><TH>Tel:<TD>(617) 555-1212</TR>
<TR><TH>Email:<TD>yves@coucou.com</TR>
</TABLE>
</DIV>
]PRE]

[[#comment]]

* メモ