HTML <tr>タグ
例
3行の単純なHTMLテーブル。1つのヘッダー行と2つのデータ行：
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
<tr>タグは、HTMLテーブルの行を定義します。
<tr>要素には、1つ以上の< th>または
<td>要素が含まれます。
ブラウザのサポート
| Element | |||||
|---|---|---|---|---|---|
| <tr> | Yes | Yes | Yes | Yes | Yes |
グローバル属性
この<tr>タグは、HTMLのグローバル属性もサポートしています。
イベント属性
この<tr>タグは、HTMLのイベント属性もサポートしています。
その他の例
例
<tr>内のコンテンツを（CSSを使用して）整列させる方法：
<table style="width:100%">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr style="text-align:right">
<td>January</td>
<td>$100</td>
</tr>
</table>
例
表の行に背景色を追加する方法（CSSを使用）：
<table>
<tr style="background-color:#FF0000">
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
例
<tr>内のコンテンツを垂直方向に整列する方法（CSSを使用）：
<table style="height:200px">
<tr
style="vertical-align:top">
<th>Month</th>
<th>Savings</th>
</tr>
<tr style="vertical-align:bottom">
<td>January</td>
<td>$100</td>
</tr>
</table>
例
テーブルヘッダーを作成する方法：
<table>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
<tr>
<td>John Doe</td>
<td>[email protected]</td>
<td>123-45-678</td>
</tr>
</table>
例
キャプション付きのテーブルを作成する方法：
<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
例
複数の行または1つの列にまたがるテーブルセルを定義する方法：
<table>
<tr>
<th>Name</th>
<th>Email</th>
<th colspan="2">Phone</th>
</tr>
<tr>
<td>John Doe</td>
<td>[email protected]</td>
<td>123-45-678</td>
<td>212-00-546</td>
</tr>
</table>
関連ページ
HTMLチュートリアル：HTMLテーブル
HTML DOMリファレンス：TableRowオブジェクト
CSSチュートリアル：テーブルのスタイリング
デフォルトのCSS設定
ほとんどのブラウザは<tr>、次のデフォルト値で要素を表示します。
tr {
display: table-row;
vertical-align: inherit;
border-color: inherit;
}