3

私の Web サイトには複数のテーマがあり、ユーザーは JavaScript リンクをクリックするだけで複数のテーマを切り替えることができます。すべてのテーマのレイアウトを処理する 5 つの CSS ファイルがあります。1つは構造用、3つはさまざまなテーマの色など、1つは他のものに共通です。

私のcssファイル名は次のように読み取られます.. main.css、red.css、green.css、black.css、others.css赤、緑、黒のcssファイルはalternate stylesheetsとして定義されています。

YSLOWを取り付けました！そして得る"This page has 5 external stylesheets. Try combining them into one."

それらのほとんどをより少ない数のCSSファイルに結合することが可能かどうか疑問に思っていました. `を定義できることは知っています

@media screen
  {
  //screen
  }
@media print
  {
  //print 
  }

` 単一の CSS ファイル内のセクション。複数のCSSファイルに対してもこのようなことを行うことはできますか?

ご協力いただきありがとうございます。

4

4 に答える 4

6

あなたのメインと他のものを組み合わせて、他の3つを添付するのではなく、必要に応じてjavascriptでそれらをロードすることはできませんか?

このようなもの：

<link rel="stylesheet" href="style1.css" id="stylesheet">

<script type="text/javascript">

function changeStyle() {
    document.getElementById('stylesheet').href = 'style2.css';
}

</script>
于 2009-07-07T09:55:04.010 に答える
6

2 つの一般的なスタイルシートを結合し、代替スタイルシートの YSlow を無視します。YSlow はツールであり、法の執行者ではありません。

于 2009-07-07T09:59:03.377 に答える
3

スタイルシートを交換する代わりに、スタイルシートを1つに結合し、代わりに本体のクラスで色を変更することができます。これは、例を使用して説明する方が簡単です。

あなたが現在持っていると言う

red.css

body { color:red; }

green.css

body { color:green; }

そして、JavaScriptを使用してそれらを交換します。

これを次のように変更してみませんか。

Colors.css

body.red { color:red; }
body.green { color:green; }

本体のクラスをJavaScriptと交換します。そうすると、CSSファイルは1つだけになり、JavaScriptもはるかに単純になります。

于 2009-07-07T09:50:47.963 に答える
0

class 属性を body タグに追加し、これを で変更できますJavaScript。次に、すべてのスタイルシートを 1 つに結合できます。

スタイルシートを作成するための興味深いツールはHSSで、ネストされた構造を作成するのに役立ちます。

于 2009-07-07T10:32:29.567 に答える