検索等で調べてみましたが、方法を見つけることが出来なかったので質問させていただきます。今までテーブルを使ってレイアウトをしていましたが、余裕も出てきたのでスタイルシートを使うことにしました。テーブルの場合はとで2つの背景色を使えたのですが、スタイルシートでこれを実現するにはどうすればいいのでしょうか。全体をやで囲んでbackground-colorを指定するという強引な事も思いつきましたが、もっとまとも(?)な方法を探しています。ちなみにスタイルシートは外部のものを読み込ませるようにしています。テーブルは表のためだけに使うべきだと思うので、テーブルを使わない方法でよろしくお願いします。

[スタイルシート] マージンとその他の部分を違う色にしたい

解決済

質問者：-hal
質問日時：2005/05/30 07:13
回答数：5件

検索等で調べてみましたが、
方法を見つけることが出来なかったので
質問させていただきます。

今までテーブルを使ってレイアウトをしていましたが、
余裕も出てきたのでスタイルシートを使うことにしました。
テーブルの場合は<body bgcolor="color1">と
<tr bgcolor="color2">で2つの背景色を使えたのですが、
スタイルシートでこれを実現するにはどうすればいいのでしょうか。
全体を<div>や<p>で囲んでbackground-colorを指定するという
強引な事も思いつきましたが、もっとまとも(?)な方法を探しています。

ちなみにスタイルシートは外部のものを読み込ませるようにしています。
テーブルは表のためだけに使うべきだと思うので、
テーブルを使わない方法でよろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (5件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： taba
回答日時：2005/05/31 03:18

現状のCSSでは、出来ないと思います。

DIVなどボックス要素の二重化は、意外と使われていたりしますね。ただ、HTML＝文書構造とCSS＝デザインの分離というのが、スタイルシートを使う大きな目的だと思われますので、確かにあまり良いとは思えません。

今のところ、他の方法でデザインにアクセントをつける工夫をするしかないでしょうね。

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
今までのレイアウトをあまり変えずに導入したいので、
やっぱり二重化するしかないようですね。
<div>タグを二重・三重と入れ子にしていくと、具体的にどういう問題が出るのでしょうか。
デメリットを知った上でとりあえずは<div>でやってみようかと思います。

通報する

お礼日時：2005/06/01 08:01

No.5

回答者： taba
回答日時：2005/06/01 23:19

＞<div>タグを二重・三重と入れ子にしていくと、具体的にどういう問題が出るのでしょうか。

問題というか、デザインのためにボックスタグを二重にする行為が、既にデザインのためにテーブルを使わないというコンセプトと矛盾するということですね。
ただ、例えばブログなどの場合、1回分の記事をDIVタグで囲い、その中に見出しのhタグ（通常タイトル）、本文のDIV、日付等のDIVなどと、構造自体が二重になっているケースもあります。そういうときはそれをうまくいかして、デザインすれば良いかと。
私はそう思っています。

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
確かに矛盾するというのもその通りですね。
<div>の二重化でデザインしてみようと思います。

通報する

お礼日時：2005/06/02 22:41

No.4

回答者： UKY
回答日時：2005/06/01 18:11

> マージンとそれ以外の部分色を変える

「マージン」とはどことどこの間のマージンなのか、「それ以外」の「それ」とは何なのかやっぱりよく分かりませんが、それでも

> ページ自体の背景色と(コンテンツを入れている)テーブルの背景色を違う色に

というのは「ページ全体を大きな枠の中に入れたい」というのと同じだとしか思えません。
body 要素に適当な幅の border を設定した上で border より外側にある余白を全部無くせばいいんじゃないんですか

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。

通報する

お礼日時：2005/06/02 22:41

No.3

回答者： UKY
回答日時：2005/05/31 21:03

「テーブルの場合は2つの背景色が使えた」というのがよく分かりませんが、単純に内容を枠で囲みたいというのであれば border プロパティで一発です。

この回答への補足

枠の表示ではなく、マージンとそれ以外の部分色を変えることが目的です。
今まではページ自体の背景色と(コンテンツを入れている)テーブルの背景色を
違う色にしていたのですが、それをスタイルシートで実現できないかと思いまして。
No.2の方が書かれたように無理みたいですね…。

補足日時：2005/06/01 08:01

通報する

- 0
- 件

通報する

No.1

回答者： steel_gray
回答日時：2005/05/30 19:25

単にテーブルをdivに置き換えるだけならば

body{background-color:color1}/*body bgcolor="color1"*/
div{background-color:color2}/*tr bgcolor="color2"*/

に、すればいいような気がするのですが…どのあたりが問題なのかちょっとわからないです。