th 要素見出しセルを表す
th 要素は表組みにおける見出しセルを表します。通常のセルを表す td 属性との組み合わせ、colspan 属性や rowspan 属性を指定することで、複数列、または複数行をまたぐセルを作成する事が可能で、複雑な表組みも表すことができます。
th 要素の仕様
- カテゴリ
-
- なし
- コンテンツモデル
-
ただし、header、footer 要素、セクショニング・コンテンツ、ヘッディング・コンテンツを子孫に持つことはできません。
- この要素を使用できる文脈
tr 要素の子要素として
- この要素で使用できる属性
詳細説明
th 要素に指定できる属性は下記の通りです。
| 属性 | 概要 |
|---|---|
| colspan 属性 | 複数列をまたぐセルにおいて、そのセルがまたぐ列数を指定します。値は正の整数のみ指定可能です。 |
| rowspan 属性 | 複数行をまたぐセルにおいて、そのセルがまたぐ行数を指定します。値は 「0」、または正の整数を指定可能です。「0」 を指定した場合、そのセルが属する行グループの最後の行までまたぎます。 |
| headers 属性 | 見出しセルとセルを関連付けます。見出しセルに与えた id 属性値を headers 属性に指定します。値は半角スペースで区切って複数指定可能なため、複数の見出しセルと関連付けることが可能です。 |
| scope 属性 | 見出しセルがどの方向のセルに対して対応するのかを指定します。 | abbr 属性 | 見出しセルに対する代替えラベルを指定します。見出しセルを短縮した名称などです。 |
scope 属性
scope 属性に指定できる値は、下記の通りです。
| 属性値 | 概要 |
|---|---|
| col | 見出しセルが属する列の下方向。 |
| row | 見出しセルが属する行の、該当するセル以降のセルすべて。 |
| colgroup | 見出しセルが属する列グループのうち、該当するセル以降のセルすべて。 |
| rowgroup | 見出しセルが属する行グループのうち、該当するセル以降のセルすべて。 |
| auto | 文脈によって自動的に判断されます。（初期値） |
th 要素のサンプルソース
<table> <thead> <tr> <th scope="col">属性</th> <th scope="col">概要</th> </tr> </thead> <tbody> <tr> <td>name 属性</td> <td>データが送信される際のクエリ名を指定します。</td> </tr> <tr> <td>multiple 属性</td> <td>複数の選択肢を選択を可能にします。</td> </tr> </tbody> </table>
主要ブラウザの対応
| IE11 | ○ |
|---|---|
| Edge（EdgeHTML） | ○ |
| Edge（Chromium） | ○ |
| Chrome | ○ |
| Firefox | ○ |
| Safari | ○ |
| iOS Safari | ○ |
| Android Chrome | ○ |