theadタグ
theadは、テーブルのヘッダー行領域を表すタグです。
tableタグの子要素として使用します。
解説
theadはtableタグの子要素として使用し、表のタイトル部分を明示的に示したい時に使用します。
theadタグは意味付けのタグのため、theadタグを使用してもCSSを適用させない限り見た目には何も変化はありません。
また、theadタグの使用は必須ではないので使わなくても構いません。
コンテンツ・モデル
カテゴリー (自カテゴリ) | なし |
コンテキスト (親カテゴリ) | tableタグ |
コンテンツ・モデル (子カテゴリ) | trタグ |
属性
theadタグには以下の属性が指定できます。
属性 | 説明 |
---|---|
class | クラスを指定する (例)class="hoge" |
id | IDを指定する (例)id="foo" |
style | スタイルを指定する (例)style="color:red;" |
その他のグローバル属性値については、グローバル属性をご覧ください。
サンプル
表のタイトル部分、メイン部分、フッター部分を明示的に示したサンプル
<table>
<thead>
<tr><th>商品名</th><th>金額</th></tr>
</thead>
<tbody>
<tr><td>みかん</td><td>100</td></tr>
<tr><td>りんご</td><td>200</td></tr>
<tr><td>ぶどう</td><td>300</td></tr>
</tbody>
<tfoot>
<tr><td>合計</td><td>600</td></tr>
</tfoot>
</table>
商品名 | 金額 |
---|---|
みかん | 100 |
りんご | 200 |
ぶどう | 300 |
合計 | 600 |
theadを使っても使わなくても見た目に変化はありません。
備考
- theadは「table header」の略です。
- 表の領域を表すものにはthead以外に、tbodyとtfootがあります。
- thead、tbody、tfootは指定しなくても問題ありませんが、より明確に表のヘッダー部分、内容部分、フッター部分を明示したい場合は指定してください。
関連項目
- table:表を作成する
- tr:表の行を定義する
- th:表のヘッダセルを定義する
- td:表のセルを定義する
- tbody:テーブルのメイン領域を表す
- thead:テーブルのヘッダー行領域を表す
- tfoot:テーブルのフッター行領域を表す
- caption:表をのタイトルを指定する
- colgroup:表の列をグループ化する
- col:表の列を表す