ＧＴ－ＯＮＥ　楽天タグ講座　パイプ奮闘記

Freepage List

レストアの仕方

< 新しい記事

新着記事一覧(全446件)

過去の記事 >

2004/09/25

昨日紹介しました雛形では、５つのTABLEを使っています。
どのようにTABLEを重ね合わせているか、
簡単に紹介してみましょう！

あの雛形は外から、中へTABLEを　<TD>　セルの中に入れ込んで行きます。

まずは、これが一番外のTABLEです。
３列３行のセルで出来ています。お判りですよね(〃_ _)！
このTABLEの二行目二列目の　<TD>　セルの中にTABLEを入れます。
この説明を書いているセル　この中にワンポイントの背景画像や
罫線用のTABLEを入れるのですが
その、TABLEの基本になるTABLEを先に入れます。

＊判りやすいようにセルに背景色をつけています。

上のTABLEのセルの中に色々指定するTABLEの基本になるTABLEを入れます。
REDの枠で示しています。
セル内に、赤の枠のTABLEを入れました。
幅は、９５％としています。
ですからセルの背景色が少し見えていると思います。
背景色はWHITE（白）で指定しています。
セル内の基本になるTABLEが出来ました。(￣m￣*)V

上の基本のTABLEにワンポイントの背景画像のTABLEを入れます。

BLUE（青）の枠が左上の背景画像を指定しているTABLEです。
GREEN（緑）の枠が右下の背景画像を指定しているTABLEです。

両方ともTABLEのWIDTH（幅）は１００％ですが、
基本のTABLEで　cellpadding="20"　（セルの中の要素の間隔）を
指定していますから、基本のTABLEより小さくなります。

最後に罫線の背景画像のTABLEを入れます。
オレンジの枠です。
セル間を　cellSpacing=20 として２０ｐｘの余白を持たせています。
中のオレンジの枠が本文を書きます　<TD>　のセルです。

どうでしょうか！５つのTABLEの配置は判りましたでしょうか！
・・・・・お願い判って・・・(-_-;)

このように、TABLEを使いまして、色々な事が出来ます。
超初心者の方には・・・すぐには理解できないと思いますが！
おぼろげに・・・「ふう～～ん！こうなってるのか！」
と判ってくだされば幸いです。(￣‥￣)=3 ﾌﾝ

では！ε＝ε＝ε＝（┌￣）┘ダッシュ！

PS：ちなみに昨日のタグをTABLEごとに色分けしておきました。