ネットショップ運営奮戦記　

Calendar

アスパラ

(0)

パプリカ

(0)

病害虫

(0)

実験

(0)

表の枠は、border　ではなく、cellspacing を使うと便利

テーマ：ちょこっとＨＴＭＬ(216)

カテゴリ：素人が覚えた　html　タグの使い方

最近覚えた、borderの使い方です。

border　は、サファリ・インターネットエクスプローラー等、プラウザによって、表示が異なります。

最近は、border="0"　で使うようにしました。

bordercolor　というコマンドがあるのですが、これが、プラウザによっては、色指定ができない場合があります。
そうなると、見た目が考えていたものと違ってしまうので、それを解消するため、border="0"　で行うようにしました。

表枠は、というと、cellspacing と、bgcolor を使います。
Table 内で、Cellspacing で枠の幅と、bgcolor にて、枠の幅と色を指定して、trで、また、bgcolor を指定します。

私は、枠幅を３ドットにしたいので、Cellspacing は、３にしてます。

色については、外枠の色を濃くして、内側を淡くします。

　　　　ｂｇｃｏｌｏｒ＝”＃ｆｆｅｆｃｃ”

上が、table で指定する色、下が、tr で指定する色です。

赤系統を使いたいので、Ｒを基準にしております。
Ｇ・Ｂについては、少しだけ変えております。
枠内の色を決めて、枠の色は、輝度を少し落として使う様な感じで良いかと思います。
私は、この位のレベルでおとす様にしてます。

色を決める際には、検索エンジンで、「ｈｔｍｌ　色」で検索にヒットするサイトがありますので、そのサイトを使って、決める様にしてます。
サイトによっては、クリックするとプラウザ全体にその色を表示してくれるところもあります。
全体で見た時に色の感じが変わってしまうことが良くあります。
全体でみると、濃く感じ、何種類の色を見ていると淡く感じます。

選んだ色は良かったけど、なんだか、色が濃すぎて気持ち悪いとか、文字が読みにくいとかあったので、実際に全体の色を確認してから使う方が良いでしょう。

ｔａｂｌｅ

ｃｅｌｌｓｐａｃｉｎｇ＝”３”　ｂｇｃｏｌｏｒ＝”＃ｆｆｄｆｂｂ”

ｂｏｒｄｅｒ＝”１”　で、枠のラインが１ドット
枠と枠の間に１ドット有ります。

全部合わせると、３ドットとなります。

その分を枠として使うので、Ｃｅｌｌｓｐａｃｉｎｇ＝”３”としました。

これで、Ｔａｂｌｅ全体の枠の色を設定します。

ｔｒ

　ｂｇｃｏｌｏｒ＝”＃ｆｆｅｆｃｃ”

ｔｄで指定しないのは、その段全体を指定するため、１回の命令で終わります。
ｔｄで指定した場合は、全てのｔｄに同じ命令を入れる必要があります。

もし、それぞれの枠内の色を指定したい場合は、ｔｄで指定します。

お気に入りの記事を「いいね！」で応援しよう