787.txt

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

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

[25]
仕様書: 
- [[HTML 4]]
-- <IW:HTML4:"struct/tables.html">
-- [CITE[B.5 Notes on tables]]
<IW:HTML4:"appendix/notes.html#notes-tables">

[13]
:状態:[[W3C]] [[勧告]]
:[[局所名]]:[CODE(HTMLe)[table]] ([Q@en[table]] ([Q[[[表]]]]) より)
:[[名前空間URI]]:[CODE(URI)@en[[[http://www.w3.org/1999/xhtml]]]]
:[[開始タグ]]:必須
:[[終了タグ]]:必須
:[[内容モデル]]:[CODE(SGML)[([CODE(HTMLe)[[[caption]]]]?, ([CODE(HTMLe)[[[col]]]]* | [CODE(HTMLe)[[[colgroup]]]]*), [CODE(HTMLe)[[[thead]]]]?, [CODE(HTMLe)[[[tfoot]]]]?, [CODE(HTMLe)[[[tbody]]]]+)]] ([[HTML 4]])
:出現できる文脈:[CODE(SGML)[%[[block]];]] な文脈
:[[属性]]:
,属性名	,属性値	,既定値	,説明	,状態	,出典
,[CODE(HTMLa)[[[align]]]]	,	,	,揃え	,[HTML4] 非推奨
,[CODE(HTMLa)[[[bgcolor]]]]	,[CODE(SGML)[%[[Color]]]]	,	,背景色	,[HTML4] 非推奨
,[CODE(HTMLa)@en[[[bgcolorbottomleft]]]]	,	,	,	,非標準
,[CODE(HTMLa)@en[[[bgcolorbottomright]]]]	,	,	,	,非標準
,[CODE(HTMLa)@en[[[bgcolortopleft]]]]	,	,	,	,非標準
,[CODE(HTMLa)@en[[[bgcolortopright]]]]	,	,	,	,非標準
,[CODE(HTMLa)@en[[[boredr]]]]	,	,	,	,非標準
,[CODE(HTMLa)[[[border]]]]	,[CODE(SGML)[%[[Pixels]]]]	,	,境界線幅	,W3C 勧告	,[HTML 4]
,[CODE(HTMLa)[[[bordercolor]]]]	,[CODE(SGML)[%[[Color]]]]	,	,境界線色	,非標準
,[CODE(HTMLa)[[[bordercolordark]]]]	,[CODE(SGML)[%[[Color]]]]	,	,境界線色 (暗色)	,非標準
,[CODE(HTMLa)[[[bordercolorlight]]]]	,[CODE(SGML)[%[[Color]]]]	,	,境界線色 (明色)	,非標準
,[CODE(HTMLa)[[[cellspacing]]]]	,[CODE(SGML)[%[[Length]]]]	,	,こま間隔	,[HTML4]
,[CODE(HTMLa)[[[cellpadding]]]]	,[CODE(SGML)[%Length]]	,	,こま余白	,[HTML4]
,[CODE(HTMLa)[[[class]]]]	,	,	,[[級]]	,[HTML4] %[[coreattr]]
,[CODE(HTMLa)[[[cols]]]]	,	,	,	,非標準
,[CODE(HTMLa)@en[[[cool]]]]	,[[ブール型属性]]	,[[偽]]	,	,非標準
,[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)@en[[[gridx]]]]	,[CODE(SGML)@en[[[NUMBER]]]]	,	,	,非標準
,[CODE(HTMLa)@en[[[gridy]]]]	,[CODE(SGML)@en[[[NUMBER]]]]	,	,	,非標準
,[CODE(HTMLa)[[[height]]]]	,	,	,高さ	,非標準
,[CODE(HTMLa)[[[id]]]]	,	,	,一意識別子	,[HTML4] %coreattr
,[CODE(HTMLa)[[[lang]]]]	,	,	,[[自然言語]]	,[HTML4] %i18n
,[CODE(HTMLa)[[[xml]]:lang]]	,	,	,自然言語	,[XHTML1]
,[CODE(HTMLa)@en[[[noborder]]]]	,([[真偽値属性]])	,	,[[枠線]]無し	,非標準
,[CODE(HTMLa)[[[nowrap]]]]	,([[真偽値属性]])	,([[偽]])	,[[折返し]]	,非標準	,[Vodafone]
,[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)@en[[[showgridx]]]]	,[[ブール型属性]]	,[[偽]]	,	,非標準
,[CODE(HTMLa)@en[[[showgridy]]]]	,[[ブール型属性]]	,[[偽]]	,	,非標準
,[CODE(HTMLa)[[[style]]]]	,	,	,スタイル情報	,[HTML4] %coreattr
,[CODE(HTMLa)[[[summary]]]]	,[CODE(SGML)[%[[Text]]]]	,(なし)	,目的・構造	,[HTML4]
,[CODE(HTMLa)[[[title]]]]	,	,	,注釈的題	,[HTML4] %coreattr
,[CODE(HTMLa)@en[[[usegridx]]]]	,[[ブール型属性]]	,[[偽]]	,	,非標準
,[CODE(HTMLa)@en[[[usegridy]]]]	,[[ブール型属性]]	,[[偽]]	,	,非標準
,[CODE(HTMLa)[[[x-use-null-cells]]]]	,([[真偽値属性]])	,	,	,非標準	,[[ROBOHelp]]
,[CODE(HTMLa)[[[width]]]]	,[CODE(SGML)[%[[Length]]]]	,	,幅	,[HTML4] おすすめしない
,[CODE(XMLa)[[[xmlns]]]]	,[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]] 固定	,==	,[[名前空間名]]	,W3C 勧告	,[[XHTML m12n]]

** 構文解析

*** 終了タグ

[75] [[Netscape Navigator 4]] には、 [CODE(HTMLe)@en[[[table]]]]
[[要素]]の[[終了タグ]]が存在しないと[[表]]全体がまったく[[レンダリング]]されないという問題がありました。

[76] 仕様上 [CODE(HTMLe)@en[[[table]]]] [[要素]]の[[終了タグ]]は必須であるにも関わらず、
[[Netscape Navigator 4]] の致命的なバグだとして長年 [[Web]] 
製作者の頭を悩ませてきたのが印象的でした。

*** [CODE(HTMLe)@en[p]] 要素との包含関係

[77] [[HTML4]] 仕様上は [CODE(HTMLe)@en[[[table]]]] [[要素]]は [CODE(HTMLe)@en[[[p]]]]
[[要素]]内に含むことができませんでしたが、 [[Webブラウザー]]は [CODE(HTMLe)@en[[[p]]]]
[[要素]]の[[終了タグ]]が省略された場合、 [CODE(HTMLe)@en[[[table]]]]
[[要素]]を [CODE(HTMLe)@en[[[p]]]] [[要素]]の[[子供]]とみなすよう実装してきました。

[78] [[Acid2]] で [[Ian Hickson]] は仕様通り [CODE(HTMLe)@en[[[p]]]] [[要素]]を自動的に
[CODE(HTMLe)@en[[[table]]]] [[要素]]の直前で閉じることを要求しました。
以後の [[Webブラウザー]]の[[無奇癖モード]] ([[標準モード]]) はそれに従い実装するようになりました。

[79] [[HTML5]] は [[HTML4]] や [[Webブラウザー]]の[[無奇癖モード]]に倣って動作を規定してきましたが、
2009年の r3132 で[[奇癖モード]]においては [CODE(HTMLe)@en[[[table]]]]
[[要素]]を [CODE(HTMLe)@en[[[p]]]] [[要素]]の[[子供]]とみなす規定に変更されました。

[80] このことについて、 [[Ian Hickson]] は [[HTML5]] 仕様書の[[注釈]]内において、
自らの誤りであったと反省の弁を述べています。

*** [CODE(HTMLe)@en[table]] 要素内の非表要素

[81] 仕様上、 [CODE(HTMLe)@en[[[table]]]] [[要素]]の[[子供]]には [CODE(HTMLe)@en[[[caption]]]]
[[要素]]や [CODE(HTMLe)@en[[[tbody]]]] [[要素]]のような[[列群]]要素、
[CODE(HTMLe)@en[[[tr]]]] [[要素]]しか含められないことになっています。

[82] ですが、現実には [CODE(HTMLe)@en[[[table]]]] [[要素]]内にそれ以外の[[要素]]の[[タグ]]を含んだ[[文書]]が存在し、
[[Webブラウザー]]はそれらの[[レンダリング]]をも迫られます。

[83] 従来 [[Webブラウザー]]は様々な方法でこれに対応してきました。 [[WinIE]]
は[[要素名]]が[[空文字列]]の[[要素]]にそれら[[要素]]を突っ込み、
[CODE(HTMLe)@en[[[caption]]]] [[要素]]と似た形で[[レンダリング]]していました。
[[Opera]] は [[DOM]] 上は[[タグ]]の記述に近い[[要素木]]を構築し、
[[CSS]] [[レンダリング]]上は [CODE(CSS)@en[[[table-caption]]]]
に近い形とするという荒業を使っていました。

[84] [[HTML5]] は [[CSS]] の[[レンダリング・モデル]]や [[DOM]]
としての整合性と既存の[[文書]]との互換性を最大限に考慮し、[[構文解析]]の時点で
[CODE(HTMLe)@en[[[table]]]] [[要素]]内の表以外の[[タグ]]は [CODE(HTMLe)@en[[[table]]]]
[[要素]]の直前に相当する[[要素]]を挿入すると規定しています (foster parenting)。

例えば、
[PRE(HTML bad example code)[
<table><p>あいうえお<tr><td>かきくけこ</tr><p>さしすせそ</table>
]PRE]
は
[PRE(aafig)[
| <p>
|   "あいうえお"
| <p>
|   "さしすせそ"
| <table>
|   <tbody>
|     <tr>
|       <td>
|         "かきくけこ"
]PRE]
と解釈されます。

** レンダリング

[15] 
[[.//レンダリング]]を参照してください。


** 歴史

[21] [[HTML表モデル]]を参照して下さい。


** 実装

[36] '''リスト項目に画像を使うための配置表''':
[[FrontPage]] の 97 だったか 98 だったか忘れましたが、
[[リスト]]の項目の印として [CODE(HTMLe)[[[ul]]]] の記号や
[CODE(HTMLe)[[[ol]]]] の数字の他に、任意の[[画像]]を指定できました。
当時はまだ [[CSS]] の [CODE(CSS)[[[list-type-style]]]]
が使われていなかったので、 [[HTML]] としては [CODE(HTMLe)[[[table]]]]
が使われていました。 ([[FrontPage]] の他の特徴的な機能と同じように)
[[注釈宣言]]に適当に情報を詰め込んで、 [[WYSIWYG]]
な編集モードでは [CODE(HTMLe)[[[ul]]]] も画像を使ったリストを表す
[CODE(HTMLe)[[[table]]]] も区別なく扱えるようになっていました。

[38] '''整列や列の入れ替え'''

@@ 書きかけ:
表の整列は有用と考えられるが、主要な利用者エージェントには実装されていない。
テーブル・レイアウトに濫用されてきたことの他に、
連結されている時にどう扱うかが大きな課題として存在する。
[[GUI]] の [[ListView]] 制御子は列の入れ替えを実装していることが多いが、
HTML の表ではこれもあまり実装されていない。
やはり連結されている時の扱いが問題になる。
[[DOM]] 上の扱いはどうなるのか (実際に節点の文書順を入れ替えてしまうのか、
レンダリング上でのみ入れ替えるのか — 
その場合選択範囲など様々な問題が派生)

[[#comment]]


** 設計

[25] [[HTML表モデル]]を参照して下さい。


** 不思議解釈

[17] [CODE(HTMLe)[table]] は本来の表としてではなく、
頁の構成要素の[[配置]]のためだけに悪用されてきました。

しかし、そのような用途に使うと非図形的媒体での閲覧者にとっては意味のわからない情報になってしまいますし、
図形的媒体でも利用者が大きな画面での利用を強要されることになりかねませんから、
表を配置目的に使用するべきではありません。代わりに[[スタイル・シート]]が利用できます
[HTML 4]。

詳しくは[[テーブル・レイアウト]]を参照してください。

[19] 典型的レンダリングにおける [CODE(HTMLe)[[[form]]]] の余白を消すために
[CODE(HTMLe)[[[table]]]] 直下や [CODE(HTMLe)[[[tr]]]]
直下に [CODE(HTMLe)[form]] のタグを入れるという[Q[裏技]]
が不思議界では比較的良く知られていて、
信じられないことに世紀が変わった今でも愛用している人がいます。

[44]
[CITE[404 Blog Not Found:CSS - スクロール可能なテーブル w/o JavaScript]] ([CODE[2007-03-17 01:19:16 +09:00]] 版) <http://blog.livedoor.jp/dankogai/archives/50787785.html>
([[名無しさん]] [WEAK[2007-03-16 23:40:44 +00:00]])

[[#comment]]


** 例

[18] 比較的単純な表
[PRE(HTML example)[
<TABLE border="1"
          summary="This table gives some statistics about fruit
                   flies: average height and weight, and percentage
                   with red eyes (for both males and females).">
<CAPTION>A test table with merged cells</CAPTION>
<TR><TH rowspan="2"><TH colspan="2">Average
    <TH rowspan="2">Red<BR>eyes
<TR><TH>height<TH>weight
<TR><TH>Males<TD>1.9<TD>0.003<TD>40%
<TR><TH>Females<TD>1.7<TD>0.002<TD>43%
</TABLE>
]PRE]

(HTML 4 仕様書より)

レンダリング例:
[PRE (example)[
[PRE[
          A test table with merged cells
    /-----------------------------------------\
    |          |      Average      |   Red    |
    |          |-------------------|  eyes    |
    |          |  height |  weight |          |
    |-----------------------------------------|
    |  Males   | 1.9     | 0.003   |   40%    |
    |-----------------------------------------|
    | Females  | 1.7     | 0.002   |   43%    |
    \-----------------------------------------/
]PRE]

]PRE]

他のレンダリング例: <IW:HTML4:"images/mergedcells">

[16] [[行群]]や[[列群]]を使った複雑な表
[PRE(HTML example)[
<TABLE border="2" frame="hsides" rules="groups"
          summary="Code page support in different versions
                   of MS Windows.">
<CAPTION>CODE-PAGE SUPPORT IN MICROSOFT WINDOWS</CAPTION>
<COLGROUP align="center">
<COLGROUP align="left">
<COLGROUP align="center" span="2">
<COLGROUP align="center" span="3">
<THEAD valign="top">
<TR>
<TH>Code-Page<BR>ID
<TH>Name
<TH>ACP
<TH>OEMCP
<TH>Windows<BR>NT 3.1
<TH>Windows<BR>NT 3.51
<TH>Windows<BR>95
<TBODY>
<TR><TD>1200<TD>Unicode (BMP of ISO/IEC-10646)<TD><TD><TD>X<TD>X<TD>*
<TR><TD>1250<TD>Windows 3.1 Eastern European<TD>X<TD><TD>X<TD>X<TD>X
<TR><TD>1251<TD>Windows 3.1 Cyrillic<TD>X<TD><TD>X<TD>X<TD>X
<TR><TD>1252<TD>Windows 3.1 US (ANSI)<TD>X<TD><TD>X<TD>X<TD>X
<TR><TD>1253<TD>Windows 3.1 Greek<TD>X<TD><TD>X<TD>X<TD>X
<TR><TD>1254<TD>Windows 3.1 Turkish<TD>X<TD><TD>X<TD>X<TD>X
<TR><TD>1255<TD>Hebrew<TD>X<TD><TD><TD><TD>X
<TR><TD>1256<TD>Arabic<TD>X<TD><TD><TD><TD>X
<TR><TD>1257<TD>Baltic<TD>X<TD><TD><TD><TD>X
<TR><TD>1361<TD>Korean (Johab)<TD>X<TD><TD><TD>**<TD>X
<TBODY>
<TR><TD>437<TD>MS-DOS United States<TD><TD>X<TD>X<TD>X<TD>X
<TR><TD>708<TD>Arabic (ASMO 708)<TD><TD>X<TD><TD><TD>X
<TR><TD>709<TD>Arabic (ASMO 449+, BCON V4)<TD><TD>X<TD><TD><TD>X
<TR><TD>710<TD>Arabic (Transparent Arabic)<TD><TD>X<TD><TD><TD>X
<TR><TD>720<TD>Arabic (Transparent ASMO)<TD><TD>X<TD><TD><TD>X
</TABLE>
]PRE]

(HTML 4 仕様書より)

レンダリング例:
[PRE(example)[
                  CODE-PAGE SUPPORT IN MICROSOFT WINDOWS
===============================================================================
Code-Page | Name                         | ACP  OEMCP | Windows Windows Windows
    ID    |                              |            |  NT 3.1 NT 3.51    95
-------------------------------------------------------------------------------
   1200   | Unicode (BMP of ISO 10646)   |            |    X       X       *
   1250   | Windows 3.1 Eastern European |  X         |    X       X       X
   1251   | Windows 3.1 Cyrillic         |  X         |    X       X       X
   1252   | Windows 3.1 US (ANSI)        |  X         |    X       X       X
   1253   | Windows 3.1 Greek            |  X         |    X       X       X
   1254   | Windows 3.1 Turkish          |  X         |    X       X       X
   1255   | Hebrew                       |  X         |                    X
   1256   | Arabic                       |  X         |                    X
   1257   | Baltic                       |  X         |                    X
   1361   | Korean (Johab)               |  X         |            **      X
-------------------------------------------------------------------------------
    437   | MS-DOS United States         |        X   |    X       X       X
    708   | Arabic (ASMO 708)            |        X   |                    X
    709   | Arabic (ASMO 449+, BCON V4)  |        X   |                    X
    710   | Arabic (Transparent Arabic)  |        X   |                    X
    720   | Arabic (Transparent ASMO)    |        X   |                    X
===============================================================================
]PRE]

別のレンダリング例: <IW:HTML4:"images/table3">

[32] 簡単な比較表の例

[PRE(HTML example)[
<table cellpadding="5">
<tbody>
<tr>
<th></th>
<th>CSS</th>
<th>XSL</th>
</tr>
<tr>
<td>Can be used with HTML?</td>
<td>yes</td>
<td>no</td>
</tr>
<tr>
<td>Can be used with XML?</td>
<td>yes</td>
<td>yes</td>
</tr>
<tr>
<td>Transformation language?</td>
<td>no</td>
<td>yes</td>
</tr>
<tr>
<td>Syntax</td>
<td>CSS</td>
<td>XML</td>
</tr>
</tbody>
</table>
]PRE]

出典: [CITE[Web Style Sheets]] <http://www.w3.org/Style/#why>

[34] [[リスト]]の項目を表す記号や数字の位置合わせのためと思われる
[[table layout]] の例

>
[PRE(HTML illegal example code)[
<table border=0 cellpadding=0 cellspacing=0 width=585>
<tr valign=top><td width="1%" bgcolor="#dcdcdc">
<table border=0 cellspacing=0 cellpadding=2 width="100%"> 
[CODE(comment)[<!-- top 5 list -->]]
<tr><td bgcolor="#ccccff" colspan=2 class=stitle><b>&#12424;&#12367;&#12354;&#12427;&#36074;&#21839;</b></td></tr>
<tr><td width="1%" valign=top><small><b>1.</b></small></td>
<td><small><a href="/help/jp/geo/gftp/gftp-26.html" class=sbody>FTPソフトの設定について</a></small></td></tr>
[INS[[CODE(comment)[<!-- 中略 -->]]]]
<tr><td width="1%" valign=top><small><b>5.</b></small></td>
<td><small><a href="/help/jp/geo/counter/counter-09.html">カウンタがうまく動作しない</a></small></td></tr>
<!-- end top 5 -->
<tr><td colspan=2><hr width=180></td></tr>
[CODE(comment)[<!-- relevant links -->]]
<tr><td bgcolor="#ccccff" colspan=2 class=stitle>
<b>&#38306;&#36899;&#12522;&#12531;&#12463;</b>
</td></tr>
<tr><td width="1%" valign=top align=right class=sbody> ・ </td>
<td><small><a href="http://help.yahoo.co.jp/" class=sbody>Yahoo! JAPAN&#12504;&#12523;&#12503;&#12475;&#12531;&#12479;&#12540;</a></small></td></tr>
[CODE(comment)[<!-- end rel links -->]]
<tr><td colspan=2 class=sbody>
<tr><td width="1%" valign=top align=right> ・ </td>
<td><small><a href="http://bb.yahoo.co.jp/">Yahoo! BB</a></small></td></tr>
[INS[[CODE(comment)[<!-- 中略 -->]]]]
<td><small><a href="http://help.yahoo.co.jp/help/jp/md/">公開プロフィールヘルプ</a></small></td></tr>
</td></tr></table>
]PRE]

出典: [CITE[Yahoo! ヘルプ - ジオシティーズ]] 
<http://help.yahoo.co.jp/help/jp/geo/> (2005年4月現在)

常識的な人なら [CODE(HTMLe)[[[ul]]]] や [CODE(HTMLe)[[[ol]]]] や
[CODE(HTMLe)[[[h[VAR[n]]]]]] を使うところですが、
常識が通用しないからこその[[不思議マーク付け]]。
どうしてわざわざ簡単にできることを難しくするのでしょうかね?
[WEAK[(その方が制作費を高く請求できるのでしょうか。)]]
なんだか目的が良く分からない[[数値文字参照]]も使っていますし。

実は引用部は更に別の [CODE(HTMLe)[[[table]]]]
の中の一部分だったりします。
どうやら制作者自身も文書の構造をつかめていないらしく、
後半のリスト (のようなもの) の中で後から追加したらしき部分の
[CODE(HTMLe)[[[tr]]]] が別の [CODE(HTMLe)[[[td]]]]
の中に入っているという失態をやらかしています。

[35] 背景色のために [CODE(HTMLe)[[[table]]]] を使う例

>
[PRE(HTML deprecated example code)[
[CODE(comment)[<!-- Google  -->]]
<center>
<form method=GET action="http://www.google.co.jp/search">
<table bgcolor="#FFFFFF"><tr><td>
<a href="http://www.google.co.jp/">
<img src="http://www.google.com/logos/Logo_40wht.gif" 
border="0" alt="Google" align="absmiddle"></a>
<input type=text name=q size=31 maxlength=255 value="">
<input type=hidden name=hl value="ja">
<input type=hidden name=ie value=Shift_JIS>
<input type=submit name=btnG value="Google 検索">
</td></tr></table>
</form>
</center>
[CODE(comment)[<!-- Google -->]]
]PRE]

出典: [CITE[リンク、検索機能を追加]] 
<http://www.google.com/intl/ja/searchcode.html>
(2004年10月付け)

これは、 [[Google]] の検索用の[[フォーム]]に
[[Web頁]]に埋め込む例として挙げられているものです。
10年も前から[[非推奨]]であり使うべきではないと言われている
[CODE(HTMLe)[[[center]]]] を使っているのは''恥ずべきこと''ですが、
1[[こま]]だけの謎の [CODE(HTMLe)[[[table]]]]
も目に付きます。ああ、[[背景色]]を[[白]]にするために使っているのですね。
[[CSS]] が使われる前には [CODE(HTMLe)[[[table]]]]
を使って文書内の背景色を部分的に変更する[Q[[[裏技]]]]がありましたっけ。

[42]

[PRE(HTML invalid example code)[
 <TABLE class='clsContainer' CELLPADDING='15' CELLSPACING='0' float='left' WIDTH='100%' BORDER='0'> <TR> <TD VALIGN='top'>
]PRE]

;; 
[CITE@en-us[About Conditional Comments]] ([CODE[2007-01-08 14:42:10 +09:00]] 版) <http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp>

[43]
[PRE(HTML invalid example code)[
  <META NAME="GENERATOR" CONTENT="Adobe PageMill 3.0J Mac">
[VAR[...]]
			<table cool width="761" height="745" usegridx usegridy showgridx showgridy gridx="8" gridy="8" border="0" cellpadding="0" cellspacing="0">
[VAR[...]]
					<td width="8" height="672" rowspan="2"></td>
					<td width="448" height="40" align="left" xpos="160" content valign="top" csheight="32">
[VAR[...]]
				<tr height="1" cntrlrow>
]PRE]


[70]
2つの[[行]]にあたるものが1[[行]]にまとまっている例:
[PRE(HTML example code)[
<table>
<caption style="caption-side: bottom" class="comment">The 10 least popular HTML 4.x elements</caption>
   <tr>
     <th>Element</th>
     <th>Frequency</th>

     <th>Element</th>
     <th>Frequency</th>
   </tr>
   <tr class="r1">
     <td><code class="elem">TFOOT</code></td>
     <td class="num">3,947</td>
     <td><code class="elem">INS</code></td>

     <td class="num">1,344</td>
   </tr>
   <tr class="r2">
     <td><code class="elem">DFN</code></td>
     <td class="num">3,584</td>
     <td><code class="elem">KBD</code></td>
     <td class="num">1,313</td>

   </tr>
]PRE]

;; [CITE@en[MAMA: Key findings - Opera Developer Community]] ([TIME[2008-10-18 11:58:12 +09:00]] 版) <http://dev.opera.com/articles/view/mama-key-findings/>



([[名無しさん]])


[[#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] [[テーブル・レイアウト]]は[[不思議マーク付け]]の真髄にして完成形。そして最終形態。

[33]
[CITE[強制ソート可能化串]]
<http://www-higashi.ics.es.osaka-u.ac.jp/~umedu/diary/0042.html#D01110>

> コンピューター上に存在する全ての表はソート機能を持っているべきだ、というゆがんだ思想に基づいて作ってみたjavascriptプログラム。テーブルをDOMを使ってごりごり書き換えてソートできるようにするjavascriptで書かれたスクリプトが実行されるように書き換える串。

[37]
[CODE(HTMLe)@en[[[table]]]] [[要素型]]に丁度対応する[Q[[[表]]]]という[[日本語]]の[[単語]]があるにも関わらず、
なぜか、よく[Q@en[[[テーブル]]]]と[[片仮名]]で呼ばれます。
中には、[Q[[[表]]]]と[Q@en[[[テーブル]]]] ([CODE(HTMLe)@en[[[table]]]])
を区別している人もいるようですが、
そうすることに何か利点はあるのでしょうかね?

そういうことをしている人は、分かってやっているのなら良いのですが、
どうも[[表]]とは何か分かっていないきらいがありまして。

[39]
[CITE[05/10/2003勉強会の記録]] <http://www.accessibility.org/workshops/May2003/minutes.html>
([[名無しさん]])

[40]
[CITE[Mingyi's FireFox Extension for sorting HTML tables - TableSort]] <http://www.mingyi.org/other/tablesort.html>
([[名無しさん]] [WEAK[2006-05-27 01:19:10 +00:00]])

[41]
[CITE[A brief history of HTML tables]] <http://www.barry.pearson.name/articles/layout_tables/history.htm>
([[名無しさん]])

[45]
[CITE@en[Web Usability - Accessible Data Tables]] ([CODE[2007-04-17 20:23:46 +09:00]] 版) <http://www.usability.com.au/resources/tables.cfm>
([[名無しさん]])

[46]
[CITE@en[Web Usability - Accessible Data Tables]] ([CODE[2007-04-17 20:23:46 +09:00]] 版) <http://www.usability.com.au/resources/tables.cfm>
([[名無しさん]])

[47]
[CITE@en[Web Usability - Accessible Data Tables]] ([CODE[2007-04-17 20:23:46 +09:00]] 版) <http://www.usability.com.au/resources/tables.cfm>
([[名無しさん]])

[48]
[CITE@en-gb[Juicy Studio: Table Inspector - Mozilla/Firefox Extension]] ([CODE[2007-05-26 17:24:04 +09:00]] 版) <http://juicystudio.com/article/firefox-table-inspector.php>
([[名無しさん]])

[49]
[CITE@en-gb[Juicy Studio: Complex Table Inspector]] ([CODE[2007-05-26 17:24:04 +09:00]] 版) <http://juicystudio.com/article/complextableinspector.php>
([[名無しさん]])

[50]
[CITE@ja[国語辞典 英和辞典 和英辞典 - goo 辞書]] ([CODE[2007-05-27 22:47:58 +09:00]] 版) <http://dictionary.goo.ne.jp/>

[[HTML 5]] として[[構文解析]]したところ、
[CODE(HTMLe)@en[[[table]]]] が54個含まれていました。
横線1本のためにもわざわざ [CODE(HTMLe)@en[[[table]]]]
(と [CODE(CSS)@en[[[border]]]]) を使っています。
([[名無しさん]] [WEAK[2007-05-27 13:55:31 +00:00]])

[51]
[CITE@ja[Yahoo!辞書 - Yahoo! JAPANの辞書サービス]] ([[Yahoo! JAPAN]] 著, [CODE[2007-05-27 22:55:14 +09:00]] 版) <http://dic.yahoo.co.jp/>

これは33個。
([[名無しさん]] [WEAK[2007-05-27 13:56:55 +00:00]])

[52]
[CITE[エキサイト 辞書 : 英和辞書 和英辞書 国語辞典 中日辞書 日中辞書]] ([CODE[2007-05-27 22:56:39 +09:00]] 版) <http://www.excite.co.jp/dictionary/>

26個。 >>50-51 と違って [CODE(HTMLe)@en[[[th]]]] を使っているのが真新しいwwwwwwwwwww
([[名無しさん]] [WEAK[2007-05-27 13:57:49 +00:00]])

[53]
[CITE@ja[Excite エキサイト]] ([CODE[2007-05-27 23:00:10 +09:00]] 版) <http://www.excite.co.jp/>

>>52 よりよほど複雑に見えるが [CODE(HTMLe)@ne[[[table]]]]
は7個しかないぞ・・・
([[名無しさん]] [WEAK[2007-05-27 14:02:40 +00:00]])

[54]
[CITE@ja[国語 英和 和英 カタカナ 漢字 - Infoseek マルチ辞書]] ([CODE[2007-05-27 23:02:37 +09:00]] 版) <http://dictionary.www.infoseek.co.jp/>

13個。
([[名無しさん]] [WEAK[2007-05-27 14:03:31 +00:00]])

[55]
[CITE@ja[国語辞書 英和辞書 和英辞書 - livedoor 辞書]] ([CODE[2007-05-27 23:03:23 +09:00]] 版) <http://dic.livedoor.com/>

9個。
([[名無しさん]] [WEAK[2007-05-27 14:04:16 +00:00]])

[56]
>>50-55 [[Google]] の順位が下がるほど数が減ってるwwwwwwwwwww
([[名無しさん]] [WEAK[2007-05-27 14:05:57 +00:00]])

[57]
[CITE[Yahoo! JAPAN]] ([CODE[2007-05-28 00:32:47 +09:00]] 版) <http://www.yahoo.co.jp/>

103個wwwwwwwwww
([[名無しさん]] [WEAK[2007-05-27 15:33:36 +00:00]])

[58]
[CITE[雅虎首&#39029;]] ([CODE[2007-05-28 00:33:00 +09:00]] 版) <http://cn.yahoo.com/>

1個、本当の表だけ。
([[名無しさん]] [WEAK[2007-05-27 15:34:01 +00:00]])

[59]
yahoo.com 系は全然 [CODE(HTMLe)@en[[[table]]]] を使ってない。[[禿]]糞すwwwwwwwwww
([[名無しさん]] [WEAK[2007-05-27 15:36:21 +00:00]])

[60]
[CITE@en[archives related to accessible TABLE design in HTML4]] ([[Al Gilman]] 著, [CODE[2007-05-29 02:20:23 +09:00]] 版) <http://lists.w3.org/Archives/Public/www-archive/2007May/0083.html>
([[名無しさん]] [WEAK[2007-06-04 13:18:29 +00:00]])

[61]
[CITE[Bug 12740 - www.bmw.com page doesn't work]] ([CODE[2007-06-20 10:43:03 +09:00]] 版) <http://bugs.webkit.org/show_bug.cgi?id=12740>
([[名無しさん]] [WEAK[2007-06-20 01:54:15 +00:00]])

[62]
[CITE[HTML5 IRC logs: freenode / #whatwg / 20070620]] ([CODE[2007-06-20 10:53:07 +09:00]] 版) <http://krijnhoetmer.nl/irc-logs/whatwg/20070620#l-122>
([[名無しさん]] [WEAK[2007-06-20 01:55:39 +00:00]])

[63]
[CITE@en[HTML tables - trying to reach consensus]]
([Q@en[Bert Bos]] 著、[CODE@en[Wed, 3 May 95 08:52:34 EDT][1995-05-03]])
<https://listserv.heanet.ie/cgi-bin/wa?A2=ind9505&L=HTML-WG&P=R5126>
([[名無しさん]])

[64]
[CITE[html-wg-95q2: Yet another table proposal for HTML 2.1]] ([CODE[2007-07-01 19:46:05 +09:00]] 版) <http://ksi.cpsc.ucalgary.ca/archives/HTML-WG/html-wg-95q2.messages/0520.html>
([[名無しさん]])

[65]
[CITE@en-us[HTML5 Tables]] ([CODE[2007-08-01 21:31:50 +09:00]] 版) <http://www.search-this.com/2007/07/30/html5-tables/>
([[名無しさん]] [WEAK[2007-08-01 12:34:43 +00:00]])

[66]
[CITE[Table Inspector]] ([CODE[2007-08-22 08:03:53 +09:00]] 版) <http://wordsandpictures.dyndns.org/table_inspector.html>
([[名無しさん]] [WEAK[2007-08-22 01:46:22 +00:00]])

[67]
[CITE[Tables in HTML - Anne’s Weblog]] ([CODE[2007-09-07 06:15:43 +09:00]] 版) <http://annevankesteren.nl/2007/09/html-tables>
([[名無しさん]])

[68]
[CITE[JavaScript - tableのオートフィルタ]] ([CODE[2007-03-18 00:00:00 +09:00]] 版) <http://neko.dosanko.us/script/auto-filter/>
([[名無しさん]])

[69]
[CITE@en-GB[Collections of Interesting Data Tables]] ([CODE[2008-04-07 17:14:18 +09:00]] 版) <http://sitesurgeon.co.uk/tables/>

[71] [CITE[Table Sorting]] ([TIME[2002-03-02 19:14:02 +09:00]] 版) <http://www2u.biglobe.ne.jp/%7Eoz-07ams/prog/dom-notes/sort_rows.html>

[72] [CITE@en[Table feedback]] ([[Ian Hickson]] 著, [TIME[2008-12-20 18:21:53 +09:00]] 版) <http://lists.w3.org/Archives/Public/public-html/2008Dec/0175.html>

[73] [CITE@en-US[Tableのデザインまとめ | DesignWalker]] ([TIME[2009-02-08 17:51:33 +09:00]] 版) <http://www.designwalker.com/2009/01/table.html>

[74] [CITE[MOONGIFT: » もうこれで十分。HTML上でテーブルを表示するなら「Sigma Grid」:オープンソースを毎日紹介]] ([[MOONGIFT]] 著, [TIME[2009-02-08 19:19:22 +09:00]] 版) <http://www.moongift.jp/2008/11/sigma_grid/>

[85] [CITE@en[The Last of the Parsing Quirks]]
([[Henri Sivonen]] 著, [TIME[2009-06-05 20:09:06 +09:00]] 版)
<http://hsivonen.iki.fi/last-html-quirk/>

[86] [CITE@en[Web Applications 1.0 r5755       Nulls in <table> shouldn't cause white space to move before the table.]]
( ([TIME[2011-01-11 07:08:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=5754&to=5755>

[87] [CITE@en[Web Applications 1.0 r6006 10963]]
( ([TIME[2011-04-14 09:58:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=6005&to=6006>

[88] [CITE@en[Web Applications 1.0 r6008 7468]]
( ([TIME[2011-04-15 08:46:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=6007&to=6008>

[89] [CITE@en[Web Applications 1.0 r7188 Source cleanup: remove the text that the HTMLWG version has that is all wishy washy about presentational tables for no good reason.]]
( ([TIME[2012-07-20 12:40:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=7187&to=7188>

[90] [CITE@en[Web Applications 1.0 r7278     turns out 'table' needs box-sizing:border-box for compat with gecko and opera. in webkit it's quirks-only. (couldn't test IE)]]
( ([TIME[2012-08-27 10:16:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=7277&to=7278>

[91] [CITE[''''''[''''''whatwg'''''']'''''' Proposal about the table cell relationship combined with the column grouping and the row grouping]]
( ([TIME[2012-09-06 18:22:45 +09:00]] 版))
<http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-September/037185.html>

[92] [CITE[''''''[''''''whatwg'''''']'''''' Sortable Tables]]
( ([TIME[2012-11-06 19:39:57 +09:00]] 版))
<http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-November/037792.html>

[93] [CITE[WWW-Talk Apr-Jun 1993: Tables and HTML+]]
( ([TIME[2013-03-05 12:50:31 +09:00]] 版))
<http://1997.webhistory.org/www.lists/www-talk.1993q2/0271.html>

[94] [CITE[''''''[''''''whatwg'''''']'''''' Feedback on a variety of elements]]
( ([TIME[2013-07-23 21:15:30 +09:00]] 版))
<http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2013-July/040190.html>

[95] [CITE[WDC - Web Tables]]
( ([[Petar Risotski, Christian Bizer, Oliver Lehmberg, Heiko Paulheim]] 著, [TIME[2014-03-10 11:25:02 +09:00]] 版))
<http://webdatacommons.org/webtables/>

[96] [CITE[ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic]]
( ([TIME[2014-04-07 05:26:16 +09:00]] 版))
<https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L56>

[97] [CITE[Welcome to Netscape Navigator Version 1.1]]
( ([TIME[2014-04-07 08:52:29 +09:00]] 版))
<http://web.archive.org/web/20030203042026/http://wp.netscape.com/eng/mozilla/1.1/relnotes/windows-1.1.html#Images>

[98] [CITE[Tables in Netscape 1.1]]
( ([TIME[2014-04-07 08:52:43 +09:00]] 版))
<http://web.archive.org/web/20030202005713/http://wp.netscape.com/assist/net_sites/tables.html>

[99] [CITE@en[Web Applications 1.0 r8665       PARSER: Add a parse error for non-space characters in <table> elements]]
( ([TIME[2014-06-09 14:43:00 +09:00]] 版))
<http://html5.org/r/8665>

[7] [CITE@en[Let HTMLTableElement create*() and insertRow() return specific types · whatwg/html@93cb3d6]]
([TIME[2015-12-01 11:37:58 +09:00]] 版)
<https://github.com/whatwg/html/commit/93cb3d61526cf956a739c57398760dc8a3a633bd>

[20] [CITE@en[Disallow <tfoot> before <tbody> in the content model · whatwg/html@94d55af]]
([TIME[2015-12-19 22:59:42 +09:00]] 版)
<https://github.com/whatwg/html/commit/94d55af9cda601ce675d15f6a0e52c9bb9c6afa9>

[22] [CITE@en[Fix #345: Remove table sorting model · whatwg/html@59b7e24]]
([TIME[2016-01-29 23:28:31 +09:00]] 版)
<https://github.com/whatwg/html/commit/59b7e2466c2b7c5c408a4963b05b13fd808aa07a>

[23] [CITE@en[Embedding Tabular Metadata in HTML]] ([TIME[2016-02-26 00:45:18 +09:00]] 版) <https://w3c.github.io/csvw/html-note/#extracting-table-data>

[24] >>23 は [[HTML]] の [CODE(HTMLe)@en[[[table]]]] を [[CSV on the Web]]
に準じて取り扱う方法を規定しています。 [[W3C HTML5]] を参照こそしていますが、
その[[表モデル]]は完全に無視していて、独自の方法で処理することにしています。
例えば [CODE(HTMLe)@en[[[thead]]]] [[要素]]の[[意味]]も無視されて、
[CODE(HTMLe)@en[[[tbody]]]] [[要素]]と同じように扱われます。
[CODE(HTMLa)@en[[[colspan]]]] や [CODE(HTMLa)@en[[[rowspan]]]]
も、使うべきではないと述べて明確な処理の規定を避けています。

;; [26] せっかく [[HTML]] の[[表]]の解釈方法が明確かつ厳密に定められているのに、
その[[意味]]を無視して独自の曖昧な処理を定義するというのは、
[[標準化]]の意義を見失っているように思いますが...

[28] [CITE@en[Formalize custom element reactions · whatwg/html@27aa7bc]]
([TIME[2016-04-26 18:55:45 +09:00]] 版)
<https://github.com/whatwg/html/commit/27aa7bc4fa6f168654a8c858f0773e611f679b39>

[29] [CITE@ja[CSSだけでレスポンシブなテーブルデザイン3種 – Yuru Warp]]
( ([TIME[2016-06-17 12:32:37 +09:00]]))
<http://yuruwarp.com/coding/responsive-table-css>

[30] [CITE@en['''['''giowct''']''' (3) PARSER: Add a parse error for non-space characters in <t…]]
([[Hixie]]著, [TIME[2014-06-09 14:43:49 +09:00]])
<https://github.com/whatwg/html/commit/dab72ccea3b31bb74489358c6be5d7cc1cfe8ead>

[31] [CITE@en[Standardize special behavior of colspan/rowspan]]
([[ayg]]著, [TIME[2017-04-26 23:28:48 +09:00]])
<https://github.com/whatwg/html/commit/4fbd00f5c5a839dcde33d2820c2cd57ddefa8a6e>

[100] [CITE[HTML4/CSS2 Accessibility Recommendations]]
([TIME[2017-05-23 00:46:01 +09:00]])
<https://www.w3.org/WAI/PF/guide.html#TABLE>

[101] [CITE@en[dfn what it means for elements to be “referenced”]]
([[sideshowbarker]]著, [TIME[2017-07-15 19:05:30 +09:00]])
<https://github.com/whatwg/html/commit/d0872abf29373f284c93434875e2e30d12602081>