ウェブランサー

<th> テーブル(表)の見出しとなるセルを作成

対応ブラウザ
IE7対応IE8対応Firefox対応Chrome対応Opera対応Safari対応
タイプ -
取り扱い 標準

<th>タグは、テーブル(表)の見出しとなるセルを作成する場合に指定します。通常のセルは<td>タグで作成します。

テーブル作成の基本的な流れは以下の通り。
1. まず<table>タグで表の作成を開始します
2. 次に<tr>タグで表の横一列を定義します
3. そして<td>タグで表の縦のセルを定義します

<th>タグに指定できる属性

colspan="値"
隣接するセルの横何個分に相当するのかを指定。
rowspan="値"
隣接するセルの縦何個分に相当するのかを指定。
align="値(left, center, right)"
テーブルの表示位置を指定します。
valign="値(top, middle, bottom, baseline)"
セルの内容物の縦軸に対する表示位置を指定。
width="値(数値)"
テーブルセルの幅を指定します。
height="値(数値)"
テーブルセルの高さを指定します。
border="値(数値)"
枠線(ボーダー)の太さを指定します。0を指定すると枠線が非表示になります。
bordercolor="色指定"
枠線(ボーダー)の色を指定します。
bgcolor="色指定"
背景色を指定します。
background=" URL "
背景画像を指定します。
style="プロパティ:値;"
スタイルを指定します。
id="", class=""
idやclass付けが出来ます。

<th>の使用サンプル

HTML
<table border="1" bordercolor="#AAAAAA" bgcolor="#FFFFFF" cellpadding="3">
<caption>CAPTION(キャプション)</caption>
<tr>
<th align="center" colspan="3">テーブルの作成</th>
</tr>
<tr>
<td>1</td>
<td>TABLE</td>
<td>テーブル全体の開始</td>
</tr>
<tr>
<td>2</td>
<td>TR</td>
<td>横一列を定義する</td>
</tr>
<tr>
<td>3</td>
<td>TD</td>
<td>TRの中にセルを作成</td>
</tr>
<tr>
<td>4</td>
<td>/TD</td>
<td>セル内の内容を記述してセルを閉じる</td>
</tr>
<tr>
<td>5</td>
<td>TD~/TD</td>
<td>複数セルを表示させる場合には繰り返しTDを記述</td>
</tr>
<tr>
<td>6</td>
<td>/TR</td>
<td>一行分の記述が終わったらTRを閉じる</td>
</tr>
<tr>
<td>7</td>
<td>TR, TD, /TD, /TR</td>
<td>必要回数繰り返す</td>
</tr>
<tr>
<td>8</td>
<td>/TABLE</td>
<td>テーブル全体を終了させる</td>
</tr>
</table>
表示確認
CAPTION(キャプション)
テーブルの作成
1 TABLE テーブル全体の開始
2 TR 横一列を定義する
3 TD TRの中にセルを作成
4 /TD セル内の内容を記述してセルを閉じる
5 TD~/TD 複数セルを表示させる場合には繰り返しTDを記述
6 /TR 一行分の記述が終わったらTRを閉じる
7 TR, TD, /TD, /TR 必要回数繰り返す
8 /TABLE テーブル全体を終了させる

※見やすくするためにCSSで装飾しています

<th>に関連するHTMLタグ

テーブル(表)に関連する要素
<caption> テーブル(表)にタイトルを付ける
<col> テーブル(表)の縦列の属性をまとめて指定する
<colgroup> テーブル(表)の縦列をグループ化する
<table> テーブル(表)を作成する
<tbody> テーブル(表)のボディ部分を定義する
<td> テーブル(表)のセルを作成する
<tfoot> テーブル(表)のフッタ行を定義する
<th> テーブル(表)の見出しとなるセルを作成する
<thead> テーブル(表)のヘッダ行を定義する
<tr> テーブル(表)の横一行を定義する