HTML

The HTML tr element represents a row in a table.

tr 要素

tr要素は、表の行を定義します。"tr" は "table row" の略称で、table要素の中で使用されます。この要素は、表のデータの構造を定義するために非常に重要であり、表のデータを意味のあるグループに分割し、読みやすさを向上させます。

　以下は、tr要素の基本的な使用方法です。

<table>
	<tr>
		<td>列1,行1</td>
		<td>列2,行1</td>
	</tr>
	<tr>
		<td>列1,行2</td>
		<td>列2,行2</td>
	</tr>
</table>

　上記の例では、table要素内に２つの tr要素があります。各 tr要素は、表の行を定義します。それぞれの tr要素内には、td要素が含まれ、それぞれの td要素は表のセルを定義します。

　tr要素は、th要素を使用して、表のヘッダー行を定義するためにも使用できます。以下は、th要素を使用して、表のヘッダー行を定義する方法の例です。

<table>
	<tr>
		<th>名前</th>
		<th>年齢</th>
		<th>国籍</th>
	</tr>
	<tr>
		<td>山田 太郎</td>
		<td>25</td>
		<td>日本</td>
	</tr>
	<tr>
		<td>Jane Smith</td>
		<td>30</td>
		<td>アメリカ</td>
	</tr>
</table>

　上記の例では、最初の tr要素は、th要素を使用して、表のヘッダー行を定義します。各 th要素は、表の列の見出しを定義します。次に、tr要素内には、各行のデータを定義するための td要素が含まれます。

　ただし、tr要素を thead要素の中で使う場合は、その tr要素の中には th要素しか入れることができませんので、注意してください。

　tr要素には、他にもいくつかの属性がありますが、ここでは tr要素の基本的な使用方法に焦点を当てました。tr要素は、表の構造を定義するために非常に重要であり、正しく使用することで、読みやすく、理解しやすい表を作成することができます。

tr 要素の概要

Category 「カテゴリー」

なし

コンテンツ･モデル

thead要素の中で使う場合は、0個以上の th要素。
そうでなければ、0個以上の th要素または td要素。

利用可能な場所

thead要素、tbody要素、tfoot要素、table要素の子として利用します。
ただし、table要素の子として使う場合は、caption要素、colgroup要素、thead要素より後ろに入れなければいけません。そして、この場合は、その table要素の中で tbody要素を使うことができません。

開始タグ

必須

終了タグ

該当の tr要素の直後に別の tr要素が来る場合、または、該当の tr要素が親要素の中で最後の要素となる場合に省略することが可能です。

要素固有の属性

なし

標準的なスタイル

tr {
	display: table-row;
	vertical-align: inherit;
	border-color: inherit;
}