構文
<table>
<caption>・・・</caption>
<thead>
:
</thead>
<tfoot>
:
</tfoot>
<tbody>
:
</tbody>
</table>
説明文
<table>タグで記述した表の内容を説明する見出し文を記述します。例えば,「表 表で利用できるタグ」といったような説明文を表示できます。<caption>タグは<table>タグの直後に1度だけ記載できます。
見出しの表示位置は,スタイルシートの「caption-side」を利用する。例えば,見出しを表の下に表示したい場合は「<caption style="caption-side:bottom;">見出し内容</caption>」と記述する。また,HTML 4.0 Transitionalの場合は,align属性で位置を指定することも可能である。
サンプル
HTMLソース
<table border="1" width="300" align="center">
<caption style="font-weight:700;">表 tableタグで利用できる主な
タグ</caption>
<tr style="background-color:#cccccc;">
<th>タグ名</th>
<th>意味</th>
</tr>
<tr>
<td>caption</td>
<td>表の見出しを記述する</td>
</tr>
<tr>
<td>tr</td>
<td>表の行を構成する</td>
</tr>
<tr>
<td>td</td>
<td>表のデータを記述する</td>
</tr>
</table>
ブラウザ表示例
表 tableタグで利用できる主なタグ
タグ名 |
意味 |
caption |
表の見出しを記述する |
tr |
表の行を構成する |
td |
表のデータを記述する |
対応状況
HTML |
IE |
Firefox |
Opera |
4 strict |
4 Transitional |
5 |
6 |
7 |
2 |
3 |
8 |
9 |
○ |
○ |
○ |
○ |
○ |
○ |
○ |
○ |
○ |
要素,タグ
タグ要素 |
テーブル要素 |
包括可能要素 |
インライン要素 |
タグ記述条件 |
開始タグ:必須 終了タグ:必須 |
属性
よく利用する属性
属性 |
意味 |
対応 |
HTML 4s |
HTML 4t |
その他 |
align=位置 |
見出しを表のどの位置に配置するかを指定する。「top」は表の上中央,「bottom」は表の下中央,「left」は表の左上,「right」は表の右上にそれぞれ配置する |
× |
○ |
|
valign=valign |
align属性のleftとrightを指定した際に、縦方向の配置位置を指定する。「top」の場合は表の上側,「bottom」の場合は表の下側に配置する |
× |
× |
IE |
その他の属性
属性 |
意味 |
対応 |
HTML 4s |
HTML 4t |
その他 |
class=クラス名 |
このタグのクラス名。CSSでスタイルを指定する場合などに利用される |
○ |
○ |
|
dir=方向 |
タグ内の文字の表示方向。「ltr」を指定すると文字を左から右に,rtlを指定すると「右から左」に表示する。しかし,多くのWebブラウザでは,文字コードを自動判別し,自動的に表示方向を決定している。そのため,日本語を「rtl」と指定しても実際には左から右に表示される。強制的に並び替えを行いたい場合は<bdo>タグを利用する |
○ |
○ |
|
id=ID |
タグのID。ダイナミックHTMLでタグを操作する場合や,Java Scriptでのタグの制御,個別にスタイルを指定する場合などに利用する |
○ |
○ |
|
lang=言語 |
タグ内に記述した言語。例えば,日本語の場合は「ja」,英語の場合は「en」を指定する |
○ |
○ |
|
style=スタイル |
タグのスタイル。スタイルの指定方法については「CSSの基本 (2) CSSの記述位置」を参照 |
○ |
○ |
|
title=タイトル |
タグのタイトル。一般的にタグの補足情報を記述する。一般的なWebブラウザでは,タグ上にマウス・ポインタを乗せるとツール・チップにtitle属性に指定した内容を表示する |
○ |
○ |
|
マウスやキーボードの状況変化に関わる属性
属性 |
意味 |
対応 |
HTML 4s |
HTML 4t |
その他 |
onclick=スクリプト |
このタグに対応する表示結果にマウスの左ボタンをクリックした場合に,指定したスクリプトを実行する |
○ |
○ |
|
ondblclick=スクリプト |
このタグに対応する表示結果にマウスの左ボタンをダブル・クリックした場合に,指定したスクリプトを実行する |
○ |
○ |
|
onmousedown=スクリプト |
このタグに対応する表示結果にマウスのボタンで押下した場合に,指定したスクリプトを実行する |
○ |
○ |
|
onmouseup=スクリプト |
このタグに対応する表示結果にマウスのボタンを離した場合に,指定したスクリプトを実行する |
○ |
○ |
|
onmouseover=スクリプト |
このタグに対応する表示結果にマウス・ポインタが乗った場合に,指定したスクリプトを実行する |
○ |
○ |
|
onmousemove=スクリプト |
このタグに対応する表示結果上でマウス・ポインタが動いた場合に,指定したスクリプトを実行する |
○ |
○ |
|
onmouseout=スクリプト |
このタグに対応する表示結果にマウス・ポインタが外れた場合に,指定したスクリプトを実行する |
○ |
○ |
|
onkeypress=スクリプト |
このタグに対応する表示結果にフォーカスした状態で,キーボードのキーを押下して離した場合に,指定したスクリプトを実行する |
○ |
○ |
|
onkeydown=スクリプト |
このタグに対応する表示結果にフォーカスした状態で,キーボードのキーを押下した場合に,指定したスクリプトを実行する |
○ |
○ |
|
onkeyup=スクリプト |
このタグに対応する表示結果にフォーカスした状態で,キーボードのキーから離した場合に,指定したスクリプトを実行する |
○ |
○ |
|
関連項目