td要素

td要素は、表（テーブル）のセルを表す要素。

カテゴリー セクショニング・ルート。
コンテキスト tr要素の子要素として使用できる。
コンテンツ・モデル フロー・コンテンツを内包できる。
属性 グローバル属性。
任意属性： colspan属性、rowspan属性、headers属性。
ブラウザ対応

構文

<td></td>

要点

属性

任意属性

属性 説明
colspan属性 水平方向のセルの結合数（セルがまたがる列数）を指定する属性。
rowspan属性 垂直方向のセルの結合数（セルがまたがる行数）を指定する属性。
headers属性 対応する見出しセル（th要素）を指定する属性。

サンプルコード

thead要素、tfoot要素、 tbody要素の子要素であるtr要素の子要素として

<table>
	<thead>
		<tr>
			<td>ヘッダーのセル</td>
			<td>ヘッダーのセル</td>
			<td>ヘッダーのセル</td>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		<tr>
		</tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
	</tbody>
	<tfoot>
		<tr>
			<td>フッターのセル</td>
			<td>フッターのセル</td>
			<td>フッターのセル</td>
		</tr>
	</tfoot>
</table>

table要素の子要素であるtr要素の子要素として

<table>
	<tr>
		<td>データセル</td>
		<td>データセル</td>
		<td>データセル</td>
	</tr>
	<tr>
		<td>データセル</td>
		<td>データセル</td>
		<td>データセル</td>
	</tr>
</table>

サンプル

thead要素、tfoot要素、 tbody要素の子要素であるtr要素の子要素として

HTMLソースコード
<table border="1">
	<thead style="background-color: lime">
		<tr>
			<th>ヘッダーのセル</th>
			<th>ヘッダーのセル</th>
			<th>ヘッダーのセル</th>
		</tr>
	</thead>
	<tbody style="background-color: aqua">
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
	</tbody>
	<tbody style="background-color: silver">
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
		<tr>
			<td>データセル</td>
			<td>データセル</td>
			<td>データセル</td>
		</tr>
	</tbody>
	<tfoot style="background-color: yellow">
		<tr>
			<td>フッターのセル</td>
			<td>フッターのセル</td>
			<td>フッターのセル</td>
		</tr>
	</tfoot>
</table>
実際の表示
ヘッダーのセル ヘッダーのセル ヘッダーのセル
データセル データセル データセル
データセル データセル データセル
データセル データセル データセル
データセル データセル データセル
データセル データセル データセル
データセル データセル データセル
フッターのセル フッターのセル フッターのセル

table要素の子要素であるtr要素の子要素として

HTMLソースコード
<table border="1">
	<tr>
		<td>データセル</td>
		<td>データセル</td>
		<td>データセル</td>
	</tr>
	<tr>
		<td>データセル</td>
		<td>データセル</td>
		<td>データセル</td>
	</tr>
</table>
実際の表示
データセル データセル データセル
データセル データセル データセル