#?SuikaWiki/0.9 page-icon="HTML"
*table 要素型 (HTML, XHTML 1)

[14] [DFN[[CODE(HTMLe)[table]] 要素]]は、[DFN[[[表]]]]です。

表とは、データを二次元的に
[WEAK[(三次元以上のものを二次元に射影したものも含む。)]] 組織化したものです。

仕様書: [HTML 4]
<IW:HTML4:"struct/tables.html">

[13]
:[[開始タグ]]:必須
:[[終了タグ]]: 必須
:[[内容模型]]:[CODE(SGML)[([CODE(HTMLe)[[[caption]]]]?, ([CODE(HTMLe)[[[col]]]]* | [CODE(HTMLe)[[[colgroup]]]]*), [CODE(HTMLe)[[[thead]]]]?, [CODE(HTMLe)[[[tfoot]]]]?, [CODE(HTMLe)[[[tbody]]]]+)]]
:出現できる文脈:[CODE(SGML)[%[[block]];]] な文脈
:[[属性]]:
,[CODE(HTMLa)[[[align]]]],,,揃え,[HTML4] 非推奨
,[CODE(HTMLa)[[[bgcolor]]]],[CODE(SGML)[%[[Color]]]],,背景色,[HTML4] 非推奨
,[CODE(HTMLa)[[[border]]]],[CODE(SGML)[%[[Pixels]]]],,枠幅,[HTML4]
,[CODE(HTMLa)[[[cellspacing]]]],[CODE(SGML)[%[[Length]]]],,こま間隔,[HTML4]
,[CODE(HTMLa)[[[cellpadding]]]],[CODE(SGML)[%Length]],,こま余白,[HTML4]
,[CODE(HTMLa)[[[class]]]]	,	,	,[[級]]	,[HTML4] %[[coreattr]]
,[CODE(HTMLa)[[[datafld]]]],,,,[HTML4] 予約
,[CODE(HTMLa)[[[dataformatas]]]],[CODE(SGML)[[CODE(HTML)[[[plaintext]]]] | [CODE(HTML)[[[html]]]]]],,,[HTML4] 予約
,[CODE(HTMLa)[[[datapagesize]]]],,,,[HTML4] 予約
,[CODE(HTMLa)[[[datasrc]]]],[CODE(SGML)[%[[URI]]]],,,[HTML4] 予約
,[CODE(HTMLa)[[[dir]]]]	,	,	,[[書字方向]]	,[HTML4] %[[i18n]]
,[CODE(HTMLa)[[[frame]]]],,,枠,[HTML4]
,[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)[[[onmousemove]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseout]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseover]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseup]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[rules]]]],,,,[HTML4]
,[CODE(HTMLa)[[[style]]]]	,	,	,スタイル情報	,[HTML4] %coreattr
,[CODE(HTMLa)[[[summary]]]],[CODE(SGML)[%[[Text]]]],(なし),目的・構造,[HTML4]
,[CODE(HTMLa)[[[title]]]]	,	,	,注釈的題	,[HTML4] %coreattr
,[CODE(HTMLa)[[[width]]]],[CODE(SGML)[%[[Length]]]],,幅,[HTML4] おすすめしない

** レンダリング

[15] HTML 4 仕様書は、次のようなレンダリング例を挙げています。

- [CODE(HTMLa)[summary]] 属性を利用者が見れるようにする
- [CODE(HTMLe)[caption]] があればそれをレンダリング
- [CODE(HTMLe)[thead]] や [CODE(HTMLe)[tfoot]] があれば、
それをどこにレンダリングするのか UA はしらないといけない。
-- 頁媒体で表が複数頁に亘るなら、各頁にレンダリング
-- Scroll 表示するなら、その前後にレンダリング
- [[行群]]指定があればそれに従ってレンダリング
- 行や列やこまは集団化指定に従って適切にレンダリング
- 視覚的 UA は HTML の属性や[[スタイル・シート]]の指定に従うべき
- 全体の到着を待ちつつ順次レンダリング

UA が1パスで表を表示するためには、[[行]]を明示し ([CODE(HTMLe)[[[col]]]]),
幅を指定しなければなりません ([CODE(HTMLa)[[[width]]]])。

表の方向については [CODE(HTMLa)[[[dir]]]] 属性の解説を参照。

[[#comment]]

**歴史
,1993年11月8日,単純表,仕様案,HTML+ Discussion Document
,1994年12月   ,単純表,実装  ,[[NCSA Mosaic]] 2.0A8
,1995年3月28日,単純表,仕様案,[[HTML 3.0]] [[I-D]] 00
,1995年4月    ,単純表,実装  ,[[NN]] 1.1
,1995年7月7日 ,複雑表,仕様案,html-tables I-D 00 (後の RFC 1942)
,1995年8月    ,単純表,実装  ,とりあえず実装した [[WinIE]] 1.0
,1995年10月   ,単純表,実装  ,WinIE 2.0B 本格実装
,1996年1月23日,複雑表,仕様案,WD-tables 『The HTML3 Table Model』
,1996年5月5日 ,      ,仕様案,HTML 3.2 Draft
,1996年5月    ,複雑表,実装  ,WinIE 3.0A1
,1996年3月    ,複雑表,仕様  ,[[RFC 1942]] 『HTML Tables』
,1996年12月   ,単純表,実装  ,[[Opera]] 2.1
,1997年1月14日,単純表,仕様  ,HTML 3.2 勧告
,1997年12月   ,複雑表,仕様  ,HTML 4.0 の最初の勧告
,1998年7月20日,単純表,実装  ,[[w3m]] の最初の表実装
,             ,複雑表,実装  ,新 [[Mozilla]] ([[Gecko]])
,2000年1月    ,複雑表,実装  ,Opera 4.0

-<http://slashdot.jp/comments.pl?sid=81655&cid=280883>
- [7] [CODE(HTML)[table]] を最初に実装したのは [[NN]] だと思ってる人は多いけど、実はそうじゃないんだなぁ。 (確かに普及させたのは NN だ。)
[[#comment]]

** メモ
-[1] ''Tables in Netscape 1.1'' <http://wp.netscape.com/assist/net_sites/tables.html>
(HTML の標準化に関わっていない) 人々が見て, 学んだ、たぶん最初の table 要素の reference。
- [2] ''TABLE幅の計算方法'' <http://www.parkcity.ne.jp/~chaichan/qanda/qa3615.htm> 伝統的 [[HTML]] layout における [CODE(HTML)[TABLE]] 要素の幅の算出方法 (実装) について。
- [3] ''テーブルアート(HTMLタグ)のページ'' <http://hi.sakura.ne.jp/~okada/table/> [CODE(HTML)[TABLE]] 要素群と非推奨属性群を使って''絵''を描いたもの。手書きでやったらしい。よくやるのぅ。
- [4] >>3 こういう系 (他にも■とかの文字と [[font]] 要素を使って絵を描くのを見たことがある。) って、[[不思議マーク付け]]を超えて、 [CODE(HTML)[image/x-html+sgml]] とか名乗ったら良いと思う(w
- [5] >>3-4 いまや [[GIMP]] でも出来るらしい。 <http://www004.upp.so-net.ne.jp/iccii/gimp/startgimp-web.html>
- [6] ''w3mの開発について'' <http://www2u.biglobe.ne.jp/~hsaka/w3m/doc-jp/STORY.html>: [[w3m]] が盛り上がったのは[[テーブル・レイアウト]]のせいであったという衝撃の事実(w。 w3m の表レンダリング算法の解説もあって参考になろう。
-[[HTML+]]: ''Tables'' <http://www.w3.org/MarkUp/HTMLPlus/htmlplus_39.html>
-[[RFC 2070]] (HTML 2.[VAR[x]]) には表要素なし。
-''Table'' <http://www.blooberry.com/indexdot/html/tagpages/t/table.htm>: 表の実装は複雑なためか、怪しい不具合が一杯あったりします。その一部が紹介されています。
-HTML 3.0: ''Tables'' <http://www.w3.org/MarkUp/html3/tables.html>
-『The HTML3 Table Model』 W3C WD (1996/1/23) <http://www.w3.org/TR/WD-tables.html> (内容は RFC 1942 draft)。
-''diary07'' <http://homepage2.nifty.com/aito/BU/diary07.html#7/20>: [[w3m]] が table に対応。
- [11] >>3 ''【TABLE】テーブルアート 1【/TABLE】'' <http://pc2.2ch.net/test/read.cgi/hp/1049865199/>
- [8] ''Table Sorting'' <http://www2u.biglobe.ne.jp/~oz-07ams/prog/dom-notes/sort_rows.html>: [[DOM]]/[[JavaScript]] を使った表の [[sort]]。
- [9] 大昔、 [CODE(HTML)[TABLE]] 要素の出現してすぐの頃、 [CODE(HTML)[TABLE]] 未対応 [[UA]] では表系のタグがすべて無視されて、表の内容がつながって表示されてしまうという問題がありました。そのため、 [[tr]] 要素一つごとに [[br]] 要素を挿入するという[[裏技]]がありました。
- [10] >>9 [[section]] 要素的意味を持つ [[div]] 要素ごとに [[hr]] 要素を挿入するのも同じことだよなあ
- [12] [[テーブル・レイアウト]]は[[不思議マーク付け]]の真髄にして完成形。そして最終形態。
[[#comment]]

* メモ