<table><tr><td>
表(テーブル)は単に、情報を整理するための用途以外にもページ全体の段組などにも使用でき、使用頻度の高いタグです。ぜひ、ここでマスターしておきましょう。
テーブルタグは<table>タグ単体では、動作しません。このタグの他に表の行を表す<tr>、さらに列を表す<td>タグがあって初めて表が現れます。従って、表のオプションを省けば、<table><tr><td>が一つのセットと考えると良いでしょう。
<tr>は行、<td>はその行に対する列を表しますので、例えば、1行に3列表示したい場合は、<tr>タグ内に<td>を3つ書き入れます。そして、一つの領域をセルと呼ぶとすると、セル内に書き入れる文字は左側のセルから<td>タグ内に収めていきます。詳しくは以下の例を見てください。
記述例
<table border=”1″>
<tr>
<td>左側のセル</td>
<td>中央のセル</td>
<td>右側のセル</td>
</tr>
</table>
<tr>
<td>左側のセル</td>
<td>中央のセル</td>
<td>右側のセル</td>
</tr>
</table>
左側のセル | 中央のセル | 右側のセル |
※分かりやすいように表に枠をつけています。
この仕組みを理解すれば、後は簡単です。例えば、2行3列の表を作りたいのであれば、<tr>タグが2つ、<td>タグは各行に3つですから、<td>タグは全部で6つ書く必要があります。
さらに細かい表の設定は以下のテーブルタグ一覧をご覧ください。
関連情報
- テーブルタグ一覧
-
- 表を挿入する
- 表の枠を指定する、または枠を消す
- 表全体の横幅をサイズ指定する
- 表全体の縦幅をサイズ指定する
- 表の罫線の幅をサイズ指定する
- 表のセル内の余白(マージン)を指定する
- 表全体の背景色を設定する
- 表全体の背景画像を設定する
- 表の表示位置を指定する
- 表の概要や要約を記入する
- 表題(表のタイトル)を記入する
- 行単位で背景色を設定する
- 行単位で背景画像を設定する (#)
- セルごとに横幅をサイズ指定する
- セルごとに縦幅をサイズ指定する
- セルごとに背景色を設定する
- セルごとに背景画像を指定する
- セル内に記入した文字の横方向の表示位置を指定する
- セル内に記入した文字の縦方向の表示位置を指定する
- 横方向にセルを結合する
- 縦方向にセルを結合する
- セル内で自動的に改行をさせない
- 表の見出しを指定する
- 表の構造を明確にする(グループ化する)