TABLE−テーブル

　TABLE要素は、行と列に配列した多次元のデータの表を設定します。 TABLEはレイアウト装置としてよく使われますが、出来るだけこの使い方は避けるべきです。テーブルは画面が小さいユーザーやテキスト・ブラウザのユーザーに問題を引き起こす原因になりますし、この問題はテーブルが唯レイアウト目的で使われている場合によくおこります。また、ブラウザはテーブルを全部読み込むまで画面に表示せず、これはテーブル内に文書全体を置いている場合に顕著にあらわれます。レイアウトのためには TABLEでなく、 スタイル・シートを試みるべきですが、まだブラウザのスタイル・シート装備にバグあり、うまくいきません。

　TABLEはテーブルに豊富な構造を提供するために、色々な要素が選択できます。選択性の CAPTION要素は、テーブルの表題をつくり、それに続いて COLやCOLGROUP要素が来て列の幅やグループ化を設定します。引き続いて、 THEAD・ TFOOT・ TBODY要素は、行のグループ化を設定します。選択性の THEADや TFOOT要素は頭部や末尾部の行を内容にとり、一方 TBODY要素はテーブルの主行のグループ化を提供します。行グループには各行の TR要素を内容にとり、個々の TR要素はヘッダーとデーター・セルをそれぞれ内容にとります。

　少なくとも一つの TBODY要素はTABLEに要求します。 TBODYが一つしかなく、 THEADもTFOOTもない場合 TBODYの開始と終了タグは両者とも選択性です。簡単なテーブルは以下の様に表わします：

<TABLE>
  <TR>
    <TH>Abbreviation</TH>
    <TH>Long Form</TH>
  </TR>
  <TR>
    <TD>AFAIK</TD>
    <TD>As Far As I Know</TD>
  </TR>
  <TR>
    <TD>IMHO</TD>
    <TD>In My Humble Opinion</TD>
  </TR>
  <TR>
    <TD>OTOH</TD>
    <TD>On The Other Hand</TD>
  </TR>
</TABLE>

　次の例の様に、このテーブルに行のグループ化と表題によってより豊富な構造にしてみます。構造の追加は、 スタイル・シートや TABLEの体裁用の属性 を使って容易にできます。

<TABLE>
  <CAPTION>Common Usenet Abbreviations</CAPTION>
  <THEAD>
    <TR>
      <TH>Abbreviation</TH>
      <TH>Long Form</TH>
    </TR>
  </THEAD>
  <TBODY>
    <TR>
      <TD>AFAIK</TD>
      <TD>As Far As I Know</TD>
    </TR>
    <TR>
      <TD>IMHO</TD>
      <TD>In My Humble Opinion</TD>
    </TR>
    <TR>
      <TD>OTOH</TD>
      <TD>On The Other Hand</TD>
    </TR>
  </TBODY>
</TABLE>

　The TABLE要素は、テーブルの目的や構造についての説明を記載する選択性の SUMMARY属性があります。 SUMMARY属性が提供する概要は、非ビジュアル・ブラウザのユーザーにとって特に助けになります。簡潔なテーブルでは CAPTIONが概要として十分ですが、複雑なテーブルでは SUMMARY属性でのより詳しい概要が有効です。以下の例は、テーブルの説明にSUMMARYを使っています。 概要は、テーブルの前でパラグラフ内に記載することもできることに注意してしてください、ブラウザのなかにはSUMMARYをサポートしていないものもありますのでこのやり方は有効です。

<TABLE SUMMARY="このテーブルは、シンボルやギリシャ文字の
　　　　　　　　 文字符号実体参照・十進法文字符号参照
　　　　　　　　 そして十六進法文字符号参照の表です。">
  <COLGROUP>
  <COLGROUP SPAN=3>
  <THEAD>
    <TR>
      <TH SCOPE=col>Character</TH>
      <TH SCOPE=col>Entity</TH>
      <TH SCOPE=col>Decimal</TH>
      <TH SCOPE=col>Hex</TH>
    </TR>
  </THEAD>
  <TBODY>
    <TR>
      <TD SCOPE=row>Latin small f with hook</TD>
      <TD>&amp;fnof;</TD>
      <TD>&amp;#402;</TD>
      <TD>&amp;#x192;</TD>
    </TR>
    ...
  </TBODY>
</TABLE>

　また、 このTABLE要素には、視覚的なブラウザでの体裁描写のヒントを設定する幾つかの選択性の属性があります。 カスケード・スタイルシートの属性と同じものが、 開発中ですが、まだ広くブラウザがサポートしていません。

• WIDTH属性は、ピクセル単位乃至は水平方向のパーセントとしてテーブルの幅を特定します。ピクセル単位の幅は避けるべきで、特に500ピクセル以上は避けるべきです。というのは、水平へ不必要なスクロールをユーザーに強いることになるからです。

• BORDER属性は、テーブルを取り巻く縁の幅をピクセル単位で特定します。

• 　FRAME属性は、ブラウザは殆どサポートしていませんが、テーブルのどの外枠を表示するかを設定します。表示しないなら void・トップ枠だけなら above・下枠だけなら below・左枠だけなら lhs・右枠だけなら rhs・全ての枠なら boxかborder です。 BORDER属性でwidthに値が設定（ FRAME=borderが初期値になります）されていない場合 初期値は、 voidです。 <TABLE BORDER>は、 <TABLE FRAME=border>の短縮型で正しいしよくサポートされています。

• RULES属性は、ブラウザは殆どサポートしていませんが、テーブル・セル間の境を設定します。内側の境は none・行グループと列グループだけの境は groups・行だけの境は rows・列だけの境は cols・全てのセルの境は allです。 Noneが、 BORDER=0が設定されているか BORDER属性が設定されていない場合に、設定されます。 Allが、 BORDERの他のいかなる使い方の場合でも、初期値です。

• 　CELLSPACING属性テーブル・セル間の空白を定義 し、 CELLPADDINGはテーブル・セル内の空白を定義しま す（言い代えると、、境とセル内容の間）。ピクセル単位やパーセントで指定しますが、パーセントをサポートしないブラウザでは CELLPADDING="20%"を CELLPADDING="20"のように処理します。 パーセントの値は、paddingやspacing指定後でできる垂直空間に対して相対的で、トップ（先頭部）とボットム（低底部）の間で割り振られます。水平方向のpaddingやspacingも、同じ態度をとります。paddingやspacingは、必ず四隅に適応されます。

  カスケード・スタイルシートの paddingプロパティー（特有値）で、別々の側に異なるpaddingを指定できますが、 CELLPADDING属性のように広くサポートされていません。

• 旧式になる（deprecated）ALIGN属性は、視覚的なブラウザでのテーブルの水平方向の配置を指定します。取り得る値としては、 left・ right・ centerです。ブラウザは、 浮いているテーブルの様に左や右に配置されたテーブルを描写し、内容はテーブルの周囲を流れ、 TABLEに従したがいます。内容を一緒に流れないようにするには、 TABLEの終に <BR CLEAR=all>を入れます。

  　殆どのブラウザは、 　TABLEでの ALIGN=centerをサポートしていませんので、 CENTER要素ないに TABLEを置きます。

  　スタイル・シートは、テーブル配置を指定するのに、より柔軟性を提供しますが、 ALIGN属性ほどは、ブラウザがサポートしていません。

• いづれ旧式になる（deprecated）BGCOLOR属性は、テーブルの背景の色を設定します。 <FONT COLOR=...>との併用は、テーブル要素がBGCOLORをサポートしていないNetscape Navigator 2.xでは、テキストが見えなくなるか読み難くなります。サポートしているブラウザでも、 BGCOLORは危険です。というのは、制作者指定の色で上書きする際その書換によく失敗するからです。 Style sheetsは、テーブルの背景色を設定するのに安全でより自由度の高い方法を提供します。

その他の情報

• W3C HTML 4.0勧告のTABLE
• W3C HTML 3.2勧告のTABLE
• WDG HTML 3.2参考書のTABLE
• TABLE in Learning HTML 3.2 by Examples