<TH>テーブルの見出しセルを表示

<TH>タグはテーブル(表)を作成する時に使う<TABLE>内で利用され、行や列の見出し(ヘッダ)を定義します。

この<TH>とは「table header」の略称で、テーブル(表)内で見出しとなるセルについては<TH>~</TH>で囲みます。 見出しに指定されたテキストは、一般的には太字でセンタリングされて表示されます。

※Internet ExplorerやNetscape Navigatorなどの一般的なブラウザの場合

なおテーブル(表)を作成する場合は、その全体を<TABLE>~</TABLE>で囲み、<TR>~</TR>で横1列分の行を囲ってまとめます。 そしてその中に<TH>とデータを入れるセル<TD>で囲う事で、テーブル(表)を表示することができます。

また一般的にはテーブル(表)の枠線はtable要素のborder属性を指定しなければ、表示されることはありません。

使用した時の例

テーブルの全体構造(図)
<table border="2">
  <tr>
     <th>名前</th>
     <th>説明</th>
     <th>特徴</th>
  </tr>
  <tr>
     <td>ヨーロッパブドウ</td>
     <td>中東が原産でヨーロッパに自生する唯一のブドウ</td>
     <td>固そうに見えるが柔らかく、果汁が多い</td>
  </tr>
  <tr>
     <td>アメリカブドウ</td>
     <td>耐病性がある北アメリカ原産のブドウ</td>
     <td>ジュースに向いているような独特の香りがある</td>
  </tr>
</table>

ブラウザ上の表示例

名前 説明 特徴
ヨーロッパブドウ 中東が原産でヨーロッパに自生する唯一のブドウ 固そうに見えるが柔らかく、果汁が多い
アメリカブドウ 耐病性がある北アメリカ原産のブドウ ジュースに向いているような独特の香りがある

属性

セルの連結
colspan="数値" セルを横方向に連結
rowspan="数値" セルを縦方向に連結
headers="" 関連する見出しセルをid属性で指定
枠線の色
bordercolor="" 枠線全体の色を指定
bordercolorlight="" 左と上の枠線の色を指定
bordercolordark="" 右と下の枠線の色を指定
背景
background="画像url" 背景画像の指定
bgcolor="" 背景色の指定
位置
align="center" セル内の行揃え
  • left・・・左揃え
  • right・・・右揃え
  • center・・・中央揃え(初期値)
  • justify・・・両端揃え
  • char・・・指定文字揃え
valign="middle" セル内の縦方向の位置
  • top・・・上
  • middle・・・中央(初期値)
  • center・・・中央
  • bottom・・・下
  • baseline・・・1行目のベースライン
height="" セルの高さ(ピクセル数または%)
width="" セルの横幅(ピクセル数または%)
nowrap="" セル内で自動改行を禁止
char="" 位置を揃える文字の指定
charoff="" セルの左端からどの位置に文字を表示するか指定

対応ブラウザなどのデータ

形式 <th>~</th> 分類 ブロックレベル要素
親要素 tr 子要素 フローコンテンツ
開始タグ 必須 終了タグ 省略可能
属性 abbr / scope / axis
汎用属性 accesskey / class / contenteditable / dir / hidden / id / lang / spellcheck / style / tabindex / title / translate
対応ブラウザ Internet Explorer2~ , Google Chrome1~ , Firefox1~ , Opera1~ , Safari1~

HTML5での状況と関連情報

abbr、align、axis、char、charoff、height、nowrap、valign、widthの各属性は、HTML5では廃止。