<TABLE> <CAPTION> <TBODY> <TR> <TH> <TD>
HTML3.2で新しく追加された表ですが、実に簡単です。恐れることはありません。例えば、
ハイブリッド車の比較 プリウス エンジンを止めたまま、モーターだけで走り出せます。 インサイト エンジンをかけないと、走り出せません。
を書くには、
<TABLE>
<CAPTION>ハイブリッド車の比較</CAPTION>
<TBODY>
<TR><TH>プリウス</TH><TD>エンジンを止めたまま、モーダーだけで走り出せます。</TD></TR>
<TR><TH>インサイト</TH><TD>エンジンをかけないと、走り出せません。</TD></TR>
</TBODY>
</TABLE>
と書きます。では、ひとつひとつ見ていきましょうか。
- まず、表全体を表す<TABLE>があります。
- 表全体の中に、表の名前を表す<CAPTION>と、表本体を表す<TBODY>があります。ただし、<CAPTION>は書かないことが多いです。
- 表本体の中に、表の行(Table Raw)を表す<TR>があります。
- 各行の中に、見出し(Table Header)を表す<TH>か、値(Table Data)を表す<TD>があります。
基本は、表の中に行があり、行の中には見出しか値が入る。たった、それだけのことです。さて、ここまでの話をツリー図で見てみると、
になります。簡単ですね。もちろん、もっと複雑な表を作ることもできますが、表の複雑さに応じて、タグの使い方も複雑になります。また、このページの表は、CSSを使ってデザインを変更しているので、素のHTMLだけでは、このような見た目にはなりません。
ところで、表というのはレイアウトがあってこそ、初めて意味を成すものなので、SGMLの世界では表を表すのにとても苦労したそうです。このあたりにもSGMLの矛盾がちらほら。
では、次はクリッカブル・マップの作り方です。