td 要素表組みのセルを表す

td 要素は表組みにおけるセルを表します。colspan 属性や rowspan 属性を指定することで、複数列、または複数行をまたぐセルを作成する事が可能で、複雑な表組みも表すことができます。

また、そのセルの見出しとなるセル (th 要素) がどこかを指定するため、headers 属性を使用することもできます。この値に、見出しセルに与えた id 属性値を指定することで、見出しセルと関連付けることができます。

td 要素の仕様

カテゴリ
コンテンツモデル
この要素を使用できる文脈

tr 要素の子要素として

この要素で使用できる属性

詳細説明

td 要素に指定できる属性は下記の通りです。

属性 概要
colspan 属性 複数列をまたぐセルにおいて、そのセルがまたぐ列数を指定します。値は正の整数のみ指定可能です。
rowspan 属性 複数行をまたぐセルにおいて、そのセルがまたぐ行数を指定します。値は 「0」、または正の整数を指定可能です。「0」 を指定した場合、そのセルが属する行グループの最後の行までまたぎます。
headers 属性 見出しセルとセルを関連付けます。見出しセルに与えた id 属性値を headers 属性に指定します。値は半角スペースで区切って複数指定可能なため、複数の見出しセルと関連付けることが可能です。

td 要素のサンプルソース

<table>
 <thead>
  <tr>
   <th id="header01">属性</th>
   <th id="header02">概要</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td headers="header01">name 属性</td>
   <td headers="header02">データが送信される際のクエリ名を指定します。</td>
  </tr>
  <tr>
   <td headers="header01">multiple 属性</td>
   <td headers="header02">複数の選択肢を選択を可能にします。</td>
  </tr>
  <tr>
   <td headers="header01" rowspan="2">type 属性</td>
   <td headers="header02">値が 「text」 の時…</td>
   <td headers="header02">値が 「submit」 の時…</td>
  </tr>
 </tbody>
</table>

主要ブラウザの対応

IE11
Edge(EdgeHTML)
Edge(Chromium)
Chrome
Firefox
Safari
iOS Safari
Android Chrome

仕様書の該当箇所

4.9.9 The td element

用途から目的の要素を探す

用途から HTML5 の要素を逆引きできます。

テキストに対する意味づけを行いたい
テキストの編集を示したい
改行や折り返しを指定したい
上付きや下付きを指定したい
テキストの書字方向を制御したい
テキストにルビをふりたい
箇条書きなどリストを表したい
セクションを定義したい
コンテンツをグループ化したい
画像や映像などを埋め込みたい
スクリプトやスタイルを埋め込みたい
フォーム関連の要素
テーブル関連の要素
ドキュメントにメタデータを付与したい
インタラクティブな要素
その他

このページの上部へ