テーブルタグについて(応用編)

今回はいろんなテーブルタグを教えますよう


colspan="2"の数字は横に連結させるセルの数です。

横セル連結
2行目の一つ目
2行目の2つ目

<table border="1">
<tr><td colspan="2"> 横セル連結</td></tr>
<tr><td> 2行目の一つ目</td><td> 2行目の2つ目</td></tr>
</table>



rowspan="2"は縦に連結させるセルの数です

縦セル連結
1行目の1つ目
2行目の1つ目

<table border="1">
<tr><td rowspan="2"> 縦セル連結</td><td> 1行目の1つ目</td></tr>
<tr><td> 2行目の1つ目</td></tr>
</table>



上の二つを合体させてみました

縦セル連結
横セル連結
2行目の1つ目
2行目の2つ目
3行目の1つ目
3行目の3つ目

<table border="1">
<tr><td rowspan="3"> 縦セル連結</td> <td colspan="2"> 横セル連結</td></tr>
<tr><td> 2行目の1つ目</td><td> 2行目の2つ目</td></tr>
<tr><td> 3行目の1つ目</td><td> 3行目の3つ目</td></tr>
</table>



cellpadding="30"の数字の大きさで文字と表の枠の幅が変わります

1行目の一つ目

<table border="1" cellpadding="30"> <tr><td> 1行目の一つ目</td></tr> </table>



© Rakuten Group, Inc.
Mobilize your Site
スマートフォン版を閲覧 | PC版を閲覧
Share by: