2012年11月20日火曜日

Freeway テーブル_セルをもっと詳しく

まずFreewayで300×300のテーブルを作成しました。(アイテム名はitem1です)
HTMLはこうなります。

このままだと何も表示されないので、テーブルのborder(枠線)を2に変更します。
外枠2pxのテーブルが表示されました。
次に、このテーブル下記のように縦に2分割してみたいと思います。このようにテーブルアイテムの中に作成されたマスの事を『セル』と呼びます
HTMLはこのように記述します。<td>タグをもう一行加え、2つのセルのwidthの合計が、テーブルのwidth以内に収まるようにします。ついでに、右側のセルの色を赤にしてみましょう。該当セルの<td>タグの中にbgcolor="RED"と追記します。


次に横3列に分割してみたいと思います。

<tr>を2セットコピーして、hightの合計をテーブルアイテムのhightに揃えます。150+50+100=300px

セルに数字を入力してみると、とて理解し易くなります。

このように入力します。
3番と5番のセルを結合してみましょう。
基本となる3番のセルにrowspan="2"と加えます。ちなみに3つのセルを結合する場合はrowspan="3"にします。5番のセルの一行は不要になりますので削除します。

0 件のコメント:

コメントを投稿