spacer 始めよう!きれいなサイト作り spacer
 
spacer   spacer spacer
ホーム | サイトマップ
ボタン-基礎 ボタン-運営 ボタン-リンク ボタン-その他 ボタン スペーサー
spacer spacer
spacer spacer
 
・崩れにくいテーブルを作る

テーブルは時々、何らかの原因で崩れてしまうことがあります。
例えば、ブラウザの大きさを変えてみたり、違うブラウザで見たりすると、崩れていたりする場合があります。
崩れるテーブル

崩れにくいテーブルを作成する一つの手法として、入れ子方式があります。
テーブルの中にさらにもう一つテーブルを作成する方法です。
テーブル例・入れ子
<table>
<tr>
<td>
<table>
<tr>
<td><img src="images/home.gif"></td>
</tr>
<tr>
<td><img src="images/contents1.gif"></td>
</tr>
<tr>
<td><img src="images/contents2.gif"></td>
</tr>
<tr>
<td><img src="images/contents3.gif"></td>
</tr>
</table>
</td>
<td>入れ子テーブル</td>
</tr>
</table>

これはよくやる手法なので覚えておいて損はないと思います。

別の崩れ防止の手段として、画像を用いてテーブルの幅や高さを安定させる方法があります。
簡単に言うと、ほしい幅や高さの画像を用意してテーブル内に配置します。
テーブル例・画像・幅
テーブル例・画像・高さ
画像はべつに写真じゃなくても構いません。良くやる手法は下地と同じ色の単色画像をダミーとして用いる方法です。

ホーム > Webデザイン > テーブルについて2 ↑このページのトップへ
 
Copyright(C) 2007 Web Design LDI All Rights Reserved.