| 形式 | <TABLE>〜</TABLE> |
|---|---|
| サポート | H3〜H4(S)〜 / e2〜 / N2〜 |
| タグの省略 | 開始タグ:必須、終了タグ:必須 |
| 包含可能要素 | CAPTION / COL / COLGROUP / THEAD / TBODY / TFOOT (直接 TR を記述した場合は、<TBODY>タグが省略されていると見なす。) |
| 属性 | 意味 |
|---|---|
| BORDER=n | H3-H4(S)/e2/N2。枠線の太さを指定します。この属性を記述しない、または、0を指定すると枠線を表示しません。 |
| BORDERCOLOR=color | e2/N4。枠線の色を指定します。 |
| BORDERCOLORDARK=color | e2。立体的な枠線の暗い部分の色を指定します。 |
| BORDERCOLORLIGHT=color | e2。立体的な枠線の明るい部分の色を指定します。 |
| FRAME=frame | H4(S)/e3。各セルの上下左右の枠線について、表示する/しないを制御します。 void - 表示しない。(既定値) above - 上側のみ。 below - 下側のみ。 hsides - 上下のみ。 vsides - 左右のみ。 lhs - 左側(Left Hand Side)のみ。 rhs - 右側(Right Hand Side)のみ。 box - 上下左右。 border - 上下左右。 |
| RULES=rules | H4(S)/e3。テーブルの内側の枠線を表示するルールを指定します。 none - 表示しない。 groups - <THEAD>, <TBODY>, <TFOOT> で指定したグループの境界のみ。 rows - 横方向のみ。 cols - 縦方向のみ。 all - すべて。(規定値) |
| 属性 | 意味 |
|---|---|
| BACKGROUND=url | e3/N4。背景画像を指定します。 |
| BGCOLOR=color | H4(T)/e2/N3。背景色を指定します。 |
| 属性 | 意味 |
|---|---|
| ALIGN=align | H3-H4(T)/e2/N2。テーブルの表示位置を指定します。
center - 中央表示(H3/e2/N4) left - 左端表示(H2/e2/N2) (既定値) right - 右端表示(H2/e2/N2) |
| CELLPADDING=n | H3-H4(S)/e2/N2。枠線とセルの内容の間の隙間をピクセル単位で指定します。 |
| CELLSPACING=n | H3-H4(S)/e2/N2。内枠の太さを指定します。0を指定すると、立体感の無い枠線を表示することができます。 |
| HEIGHT=n | e2/N2。テーブルの高さをピクセルまたはパーセンテージで指定します。 |
| HSPACE=n | N2。テーブルの周りの横方向の余白をピクセル単位で指定します。 |
| VSPACE=n | N2。テーブルの周りの縦方向の余白をピクセル単位で指定します。 |
| WIDTH=n | H3-H4(S)/e2/N2。テーブルの横幅をピクセルまたはパーセンテージで指定します。 |
| 属性 | 意味 |
|---|---|
| COLS=n | e3/N4。列数を指定します。この属性を指定することにより、テーブルの表示速度が若干速くなる場合がある。 |
| DATAPAGESIZE=size | e4。データバインド機能を用いる際の、レコード数を指定します。 |
| DATASRC=datasrc | e4。データバインド機能を用いる際の、データソースのIDを指定します。 |
| SUMMARY=summary | H4(S)。音声読み上げブラウザなどのために、この表の目的や構成の説明を記述します。 |
| 属性 | 意味 |
|---|---|
| CLASS=class | H4(S)/e3/N4。クラスを指定します。 |
| DIR=dir | H4(S)/e5。文字の表示方向を指定します。 |
| ID=id | H4(S)/e3/N4。IDを指定します。 |
| LANG=lang | H4(S)/e4。言語を指定します。 |
| LANGUAGE=language | e4。スクリプト言語を指定します。 |
| STYLE=style | H4(S)/e3/N4。スタイルシートを指定します。 |
| TITLE=title | H4(S)/e4。タイトルを指定します。 |
| HTMLソース |
|---|
<TABLE BORDER=4 WIDTH=250 ALIGN=center> <CAPTION>【テーブルの例】</CAPTION> <TR BGCOLOR="#CCCCCC"> <TH><BR></TH> <TH>列-A</TH> <TH>列-B</TH> <TH>列-C</TH> </TR> <TR ALIGN=center> <TD>行-1</TD> <TD>A1</TD> <TD>B1</TD> <TD ROWSPAN=2>C1-C2</TD> </TR> <TR ALIGN=center> <TD>行-2</TD> <TD>A2</TD> <TD>B2</TD> </TR> <TR ALIGN=center> <TD>行-3</TD> <TD>A3</TD> <TD COLSPAN=2>A3-B3</TD> </TR> </TABLE> |
| ブラウザ表示例 | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| |||||||||||||||
テーブルのそれぞれの桝目のことを「セル」と呼びます。
セルは、<TH>や<TD>タグのCOLSPAN属性やROWSPAN属性を用いて、横方向、縦方向に連結することができます。
中身が何も無いセルを <TD></TD> のように書いてしまうと、セルのへこみが無くなり少々不細工になってしまいます(左図)。この場合、<TD><BR></TD> のようにすると回避できるようです(右図)。
|
→ |
|
テーブルを横に並べて書きたい時は、枠線無しのテーブルのセルとして、並べたいテーブルを記述する方法があります。
<TABLE> <TR> <TD><TABLE BORDER=1>〜</TABLE></TD> <TD><TABLE BORDER=1>〜</TABLE></TD> </TR> </TABLE>
テーブルのセルとセルの間の隙間を無くすには、<TABLE>タグに BORDER=0 CELLSPACING=0 CELLPADDING=0 を指定し、かつ、<TD>〜</TD>の間に一度も空白や改行を入れないようにしてください。これを怠ると、Netscape Navigatorで空白が開いてしまうことがあります。