表を書く <TABLE> <CAPTION> <TR> <TH> <TD>

HTML3.2で新しく追加された表ですが、実に簡単です。恐れることはありません。例えば、

性能比較表

	BEAT	NSX
排気量	656cc	2,977cc
馬力	64ps/8,000rpm	280ps/7,300rpm

を書くには、

<TABLE border="1">
  <CAPTION align="bottom">性能比較表</CAPTION>
  <TR> <TH> <TH>BEAT <TH>NSX </TR>
  <TR> <TH>排気量 <TD>656cc <TD>2,977cc </TR>
  <TR> <TH>馬力 <TD>64ps/8,000rpm <TD>280ps/7,300rpm </TR>
</TABLE>

と書きます。では、ひとつひとつ見ていきましょうか。

まず、表全体を表す<TABLE>で囲みます。<TABLE>にはborder属性というのがあり、ここの値を変えることによって、表の枠の太さを変えられます。border="0"とすれば、枠のない表ができます。

次は表の名前です。<CAPTION>を使いますが、これは書かなくても大丈夫です。表の名前が必要であれば書いてください。

次に、表の行(Table Raw)を<TR>で囲みます。

そして、行の中に見出し(Table Header)<TH>か値(Table Data)<TD>があるわけです。この両方とも、align属性は使えます。

では、まとめてみましょう。表の中に行があり、行の中には見出しか値が入る。たった、それだけのことです。ちなみに、<TR>と<TH>と<TD>は終了タグを省略可能ですが、省略しない方が無難です。さて、ここまでの話をツリー図で見てみると、

になります。簡単ですね。ところで、表というのはレイアウトがあってこそ、初めて意味を成すものなので、SGMLの世界では表を表すのにとても苦労したそうです。このあたりにもSGMLの矛盾がちらほら。さて、もっと複雑な表を作ることもできますが、表の複雑さに応じて、タグの方も複雑になります。詳しくはNetscape社が書いた表のサンプルをご覧ください。

では、次はクリッカブル・マップの作り方です。