HTML <th> タグ

前へ 完全なHTM リファレンス 次へ

2 つの見出しと 2 つのセルを持つ簡単な HTML テーブル:

<table>
 <tr>
   <th>Month</th>
   <th>Savings</th>
 </tr>
 <tr>
   <td>January</td>
   <td>$100</td>
 </tr>
</table>
Try it Yourself ❯

他の "Try it Yourself" の例が下にあります。


定義と用法

<th> タグは、HTML テーブルのヘッダセルを定義します。

HTML テーブルには、2 種類のセルがあります:

<th> 要素のテキストは、デフォルトで、太字・中央揃えに配置されます。

<td> 要素のテキストは、デフォルトで、通常の太さ・左揃えに配置されます。


ブラウザ・サポート

要素
<th> Yes Yes Yes Yes Yes

チップスと注意事項

チップ: コンテンツを複数の列や行にまたがるようにするには、colspan と rowspan 属性を使用してください!


HTML 4.01 と HTML5 の相違点

すべてのレイアウト属性は、HTML5 から削除されました。


属性

属性 説明
abbr text ヘッダセルのコンテンツの短縮バージョンを指定する
align left
right
center
justify
char
HTML5 ではサポート対象外。
ヘッダーセル内のコンテンツを配置する
axis category_name HTML5 ではサポート対象外。
ヘッダーセルを分類する
bgcolor rgb(x,x,x)
#xxxxxx
colorname
HTML5 ではサポート対象外。
ヘッダーセルの背景色を指定する
char character HTML5 ではサポート対象外。
或る文字にヘッダーセル内のコンテンツを揃える
charoff number  HTML5 ではサポート対象外。
char 属性で指定した揃え文字から列のデータをオフセットする文字数を設定する
colspan number ヘッダーセルがまたがる列数を指定する
headers header_id セルが関連する 1 つ以上のヘッダセルを指定する
height pixels
%
HTML5 ではサポート対象外。
ヘッダーセルの高さを設定する
nowrap nowrap HTML5 ではサポート対象外。
ヘッダーセル内のコンテンツが折り返されないように指定する
rowspan number ヘッダーセルがまたがる行数を指定する
scope col
colgroup
row
rowgroup
ヘッダセルが列か、行か、列または行のグループのヘッダであるかどうかを指定する
sorted reversed
number
reversed number
number reversed
列のソート方向を定義する
valign top
middle
bottom
baseline
HTML5 ではサポート対象外。
ヘッダーセル内のコンテンツの縦方向の配置l
width pixels
%
HTML5 ではサポート対象外。
ヘッダーセルの幅を指定する

グローバル属性

<th> タグは、HTML のグローバル属性もサポートします。


イベント属性

<th> タグは、HTML のイベント属性もサポートします。


Examples

Try it Yourself - 例

テーブルヘッダ
テーブルヘッダの作成方法。

表題付きテーブル
表題付きの HTML テーブル。

テーブル内のタグ
他の要素内に要素を表示する方法。

C複数の行/列にまたがるセル
複数の行または列にまたがるテーブル・セルの定義方法。


関連ページ

HTML チュートリアル:HTML Tables

HTML DOM リファレンス:TableHeader オブジェクト

CSS チュートリアル:Styling Tables


デフォルトの CSS 設定

ほとんどのブラウザは、次のデフォルト値を使用して <th> 要素を表示しています:

th {
    display: table-cell;
    vertical-align: inherit;
    font-weight: bold;
    text-align: center;
}


前へ 完全なHTM リファレンス 次へ