縦にまたがるセルを作る
ホームページやブログなどのウェブサイトで表を表示するには TABLEタグを使用しますが、この際 縦にまたがるセルを作ることができます。
<タグ名 rowspan="連結するセルの数">～</タグ名>
- タグ名：THタグ または TD タグが使用可能です。
- 連結するセルの数：縦に連結させるセルの数を指定します。
| 宿泊日 | 金額 |
| 1泊目 | おとな 29,800円 |
| こども 22,800円 |
このサンプルのソースは、次のようになっています。
<table border="1">
<tr><td>宿泊日</td><td>金額</td></tr>
<tr><td rowspan="2">1泊目</td><td>おとな 29,800円</td></tr>
<tr><td>こども 22,800円</td></tr>
</table>
<tr><td>宿泊日</td><td>金額</td></tr>
<tr><td rowspan="2">1泊目</td><td>おとな 29,800円</td></tr>
<tr><td>こども 22,800円</td></tr>
</table>
1行目と2行目は、セルが 2列のため、<ｔｒ>と</ｔｒ>タグの中に、、<ｔd>～</ｔd>タグが2回ずつ入れ子になっています。
3行目は、1つ目のセルが上の行と連結されているために<ｔｒ>～</ｔｒ>タグの中に、、<ｔd>～</ｔd>タグが１組しかありません。
この、下のセルと連結させる指定が、 rowspan="2" です。これはサンプルソースのように、<td>タグ内の td の後ろにスペースを置いて記述されます。
同じように、横にまたがるセルを作ることもできます。詳しくはこちらをご覧ください。→横にまたがるセルを作る
ランキングに参加中です! お役に立てたらクリックをお願いします→
コンピュータとインターネット > データ形式 > HTML > リファレンス