thead, tbody, tfoot タグエレメント
thead, tbody, tfoot タグエレメントは、table のヘッダー、データ部分、フッターを明確に分けることができる HTML タグエレメントです。
thead は表のヘッダー部分、tbody はデータ部分, tfoot はフッター部分を表します。
thead, tbody, tfoot タグエレメントを使用することで、１つの表をカテゴリーごとに分けることができます。
<table> <thead> <tr><th>項目名</th><th>概要</th></tr> </thead> <tbody> <tr><td>example</td><td>例えばを意味</td></tr> <tr><td>本題</td><td>本題の説明は必要</td></tr> <tr><td>その他</td><td>他のはなし</td></tr> </tbody> <tfoot> <tr><th colspan="2">この一覧は例です</th></tr> </tfoot> </table>
| 項目名 | 概要 |
|---|---|
| example | 例えばを意味 |
| 本題 | 本題の説明は必要 |
| その他 | 他のはなし |
| この一覧は例です | |
- ad -
Example 複数のカテゴリに分ける
thead, tbody, tfoot タグエレメントによって、１つの表をカテゴリーごとに分けることができます。
例えば以下のように地方によって分けるために、thead, tbody, tfoot タグを使用している。
<table> <thead> <tr><th>都道府県名</th><th>県庁所在地</th></tr> </thead> <thead> <tr><th colspan="2">関東地方</th></tr> </thead> <tbody> <tr><td>茨城県</td><td>水戸市</td></tr> <tr><td>栃木県</td><td>宇都宮市</td></tr> <tr><td>群馬県</td><td>前橋市</td></tr> <tr><td>埼玉県</td><td>さいたま市</td></tr> <tr><td>千葉県</td><td>千葉市</td></tr> <tr><td>東京都</td><td>新宿区</td></tr> <tr><td>神奈川県</td><td>横浜市</td></tr> </tbody> <thead> <tr><th colspan="2">東海地方</th></tr> </thead> <tbody> <tr><td>愛知県</td><td>名古屋市</td></tr> <tr><td>岐阜県</td><td>岐阜市</td></tr> <tr><td>三重県</td><td>津市</td></tr> <tr><td>静岡県</td><td>静岡市</td></tr> </tbody> <tfoot> <tr><th colspan="2">この一覧は例です</th></tr> </tfoot> </table>
| 都道府県名 | 県庁所在地 |
|---|---|
| 関東地方 | |
| 茨城県 | 水戸市 |
| 栃木県 | 宇都宮市 |
| 群馬県 | 前橋市 |
| 埼玉県 | さいたま市 |
| 千葉県 | 千葉市 |
| 東京都 | 新宿区 |
| 神奈川県 | 横浜市 |
| 東海地方 | |
| 愛知県 | 名古屋市 |
| 岐阜県 | 岐阜市 |
| 三重県 | 津市 |
| 静岡県 | 静岡市 |
| この一覧は例です | |
- ad -
JavaScript
<thead>,<tbody>,<tfoot> エレメントの定義については HTMLTableSectionElement を参照してください。