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