テーブル５

***　テーブルタグ NO，5　***

今日は、テーブル内のマスを合わせるタグです。
前回のタグ説明の所を見て頂ければ解りますが、1行目は１マスのみ。２行目は２マス。…と言う様に、
複数マスを合わせる事も出来ます。

横２マスを合わせる
１マス目
２マス目

↑こんな感じです。このタグを見てみると…

<table frame="box"bgcolor="#ffffff">
<tr><td colspan="2">２マスを合わせる</td></tr>
<tr><td>１マス目</td><td>２マス目</td></tr>
</table>

マスを合わせる<td>の中に、『colspan="2"』が入っているのが解りますか?
このcolspanというのが、横に合わせるマスを指定し、
"2"が何マス合わせるのかの指定です。
気をつけるのが、マスの数。
下のマス目が２つしか無いのに、"3"を入れてしまわない様に☆彡
標準となるマスに合わせて、タグを入れますので、
３マスの場合はこうです｡｡｡

<table frame="box"bgcolor="#ffffff">
<tr><td>１マス目</td><td>２マス目</td><td>３マス目</td></tr>
<tr><td>１マス目</td><td colspan="2">★２・３マス目★</td></tr>
</table>

↓
１マス目
２マス目
３マス目
１マス目
★２・３マス目★

次は縦に合わせるタグです。
これも同じように、<td>の中に『rowspan=""』を入れます。これも、標準となるマスの数に気をつけて　入れましょう☆彡

<table frame="box"bgcolor="#ffffff">
<tr><td rowspan="2">1マス目を縦に合わせる</td><td>２マス目</td></tr>
<tr><td>ここは２マス目</td></tr>
</table>

これを表示してみると…

１マス目を
縦に合わせる
２マス目
ここは２マス目

…と、こうなる訳です★解りましたでしょうか？？？(^_^;)


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