- ベストアンサー
cssについて教えてください。
1ページづつシリーズ分けしたページが計5ページある商品紹介のコンテンツエリアをcssでコーティングしたいのですが、背景だけが違っていてその他の仕様はすべて同じときにcssはどう書いたらいいのでしょうか? 全部同じ仕様なので1つcssを作ってすべてに適用させればいいと思っていたのですが、背景だけ違うので各ページ別々のcssを作ったほうがいいのでしょうか?
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
メンテナンスが容易なのは、外部スタイルシートを次のように書きます。別に決まっているわけじゃなく任意に・・ <link rel="stylesheet" type="text/css" href="./CSS/general.css" /> <link rel="stylesheet" type="text/css" media="screen" title="標準" href="./CSS/screenShape.css" /> <link rel="stylesheet" type="text/css" media="screen" title="標準" href="./CSS/colorScheme.css" /> general.cssこれは汎用・・すべてのページで同じもの、具体的には font-family,font-size,text-indentなど、 screenShape.css・・これはデザインのみ colorScheme.css・・これ色のみ・・これをページによって分けてもよいでしょう。 また、これも簡単でよく使う方法です ページによって <body class="No1"> <body class="No2"> とかにしておくと、外部スタイルシートで一括指定できますから body.No1{background-image:url();} とかね。 スタイルシートは一枚である必要はありません。同じ詳細度なら後から登場する宣言セットが適用されます。 上記はmediaタイプやtitleが書かれていますが、私は基本的に印刷用と障害者用以外に訪問者が好きなデザインが選べるように代替スタイルシートも用意していますから・・
その他の回答 (2)
- DrFell
- ベストアンサー率55% (305/551)
背景だけの違いで、5つなら、数も多くないので、管理的にも同じ場所に記述でもいいと思います。 仮にhtmlは <div class="contents bg1"> 別のページのhtmlは <div class="contents bg2"> cssでは共通の仕様を .contents{で指定し 背景は .bg1{background: .bg2{background: と指定します。 htmlでクラスは複数書くことができます。半角のスペースで連結すれば、2つでも3つでも書くことができます。こうしなければならないではないですが、1つのクラスやIdにすべて記述してもOKですが、共通部分は使いまわしたほうがスマートだと思います。
お礼
分かりやすい回答ありがとうございました。 クラスに2つや3つ書いてcssでは共通部分と単体部分に分けることが可能なのですね。 早速やってみます。
- ibegyourpardon
- ベストアンサー率45% (46/101)
バックグラウンドを指定するタグ以外のタグを1枚のCSSに書いて、5ページそれぞれからその外部CSSを参照させます。 <link rel="stylesheet" href="hogehoge.css">などとheadに指定します。 次に背景デザインは各ページのHTML内でそれぞれのbodyタグに書いてやります。 <body style="">と言う風に。 それでお解かりでしょうか。
お礼
勉強中のためbodyにstyleを書くということがよく分からないので勉強してみます。 迅速な回答ありがとうございます。
お礼
ありがとうございました。 CSSを色とデザインに分けるやり方もあるんですね。 今の自分にはbodyにクラスを設定するやり方のほうが分かりやすいですが、CSSをもっと勉強してみます。