theadタグとは?|表(テーブル)のヘッダー部分を表す

theadタグとは?|表(テーブル)のヘッダー部分を表す
博士
表の作成方法について一通り解説したところで、今回から表の行をグループ化する3つのタグを紹介するぞ。
まず1つめは、表のヘッダー部分を表す<thead>タグじゃ。
 
 
博士
博士
リンゴが師と仰ぐ人物。
毎日HTML/CSSデザインの研究をしており、その知識を余すことなくリンゴに教えてくれる。

スポンサーリンク

<thead>タグとは

 

<thead>

対応ブラウザ Internet Explorer / Firefox / Google Chrome / Safari / Opera
分類
利用場所 table要素の子要素として1個だけ(ただし、caption要素、colgroup要素の後で、tbody要素、tfoot要素、tr要素の前)
内容 tr要素を0個以上


 
 
<thead>タグは、表(テーブル)のヘッダー部分を表す際に使用します。

thead要素、tbody要素tfoot要素は、表の横方向の並び(行)を、意味的にヘッダー、本体、フッターという構造にグループ化します。
これらの要素は省略できますが、指定すればテーブル構造をより明確にすることができます。

thead要素は、table要素の子要素として1つの表の中に1つだけ配置することができます。
配置する位置は、caption要素colgroup要素よりも後、
tbody要素、tfoot要素、tr要素よりも前に配置しなければいけません。
 
 

使用例

 
 

表示例

順位 タイトル 売上本数
1位 スーパーマリオブラザーズ 681万本
2位 スーパーマリオブラザーズ3 384万本
3位 ドラゴンクエストIII そして伝説へ… 380万本
2016年9月12日現在

 
 

まとめ

表(テーブル)のヘッダー部分を表す際は、<thead>タグを使用します。
 
 

博士
次回は、表の本体部分を表す<tbody>タグについて解説するぞ。
 
 
HTML5 タグ図鑑

HTML5タグ全種類を図鑑としてまとめています。タグの意味や使い方でわからないことがあれば、ぜひこのページをご活用ください。

HTML5 タグ図鑑へ

 
HTML5 タグ図鑑

スポンサーリンク








theadタグとは?|表(テーブル)のヘッダー部分を表す