<tr> テーブル（表）の横一行を定義する

対応ブラウザ

タイプ	-
取り扱い	標準

<tr>タグは、テーブル（表）の横一行を定義したい場合に使用します。

テーブル作成の基本的な流れは以下の通り。
1. まず<table>タグで表の作成を開始します
2. 次に<tr>タグで表の横一列を定義します
3. そして<td>タグで表の縦のセルを定義します

<tr>タグに指定できる属性

align="値（left, center, right）": テーブルの表示位置を指定します。
valign="値（top, middle, bottom, baseline）": セルの内容物の縦軸に対する表示位置を指定。
width="値（数値）": テーブルセルの幅を指定します。
height="値（数値）": テーブルセルの高さを指定します。
style="プロパティ:値;": スタイルを指定します。
id="", class="": idやclass付けが出来ます。

<tr>の使用サンプル

HTML

<table border="1" bordercolor="#AAAAAA" bgcolor="#FFFFFF" cellpadding="3">
<caption>CAPTION(キャプション)</caption>
<tr>
<th align="center" colspan="3">テーブルの作成</th>
</tr>
<tr>
<td>1</td>
<td>TABLE</td>
<td>テーブル全体の開始</td>
</tr>
<tr>
<td>2</td>
<td>TR</td>
<td>横一列を定義する</td>
</tr>
<tr>
<td>3</td>
<td>TD</td>
<td>TRの中にセルを作成</td>
</tr>
<tr>
<td>4</td>
<td>/TD</td>
<td>セル内の内容を記述してセルを閉じる</td>
</tr>
<tr>
<td>5</td>
<td>TD～/TD</td>
<td>複数セルを表示させる場合には繰り返しTDを記述</td>
</tr>
<tr>
<td>6</td>
<td>/TR</td>
<td>一行分の記述が終わったらTRを閉じる</td>
</tr>
<tr>
<td>7</td>
<td>TR, TD, /TD, /TR</td>
<td>必要回数繰り返す</td>
</tr>
<tr>
<td>8</td>
<td>/TABLE</td>
<td>テーブル全体を終了させる</td>
</tr>
</table>

表示確認

CAPTION(キャプション)
テーブルの作成
1	TABLE	テーブル全体の開始
2	TR	横一列を定義する
3	TD	TRの中にセルを作成
4	/TD	セル内の内容を記述してセルを閉じる
5	TD～/TD	複数セルを表示させる場合には繰り返しTDを記述
6	/TR	一行分の記述が終わったらTRを閉じる
7	TR, TD, /TD, /TR	必要回数繰り返す
8	/TABLE	テーブル全体を終了させる

※見やすくするためにCSSで装飾しています

<tr>に関連するHTMLタグ

テーブル（表）に関連する要素
<caption>	テーブル（表）にタイトルを付ける
<col>	テーブル（表）の縦列の属性をまとめて指定する
<colgroup>	テーブル（表）の縦列をグループ化する
<table>	テーブル（表）を作成する
<tbody>	テーブル（表）のボディ部分を定義する
<td>	テーブル（表）のセルを作成する
<tfoot>	テーブル（表）のフッタ行を定義する
<th>	テーブル（表）の見出しとなるセルを作成する
<thead>	テーブル（表）のヘッダ行を定義する
<tr>	テーブル（表）の横一行を定義する

HTML入門

初心者のためのHTML解説

詳しく＞

HTMLタグ一覧

目的や種類で探す

詳しく＞

特殊文字

HTMLで使える特殊な文字一覧

カラーコード

HTMLで使える色見本一覧

TOP