0

私が求めているのは少し奇妙だと思いますが、他に方法がありません。
この擬似CSSルールを実生活で行う方法はありますか:ルールがあるとし
ましょう: 

.myCssRule1{ color:red; }

そして、私はそれを変更することはできません(したくありません)が、次のように作成する別のルールで使用する必要があります: 

.myCssRule2{  
   .myCssRule1
}

別のメソッド内からメソッドを呼び出すのと同じです。
それを行うためのネイティブな方法またはJSライブラリはありますか?

4

3 に答える 3

2

これを行うには、LESS のような CSS フレームワークを使用できます。

LESS を使用して記述したコードは、「ネイティブ」の css ファイルにコンパイルされます。

ここに例があります: チェックアウトMixins: http://lesscss.org/

そのLESSリンクから直接取得した以下のコード

// LESS

.rounded-corners (@radius: 5px) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  -ms-border-radius: @radius;
  -o-border-radius: @radius;
  border-radius: @radius;
}

#header {
  .rounded-corners;
}
#footer {
  .rounded-corners(10px);
}

less を使用すると、次のようにコンパイルされます。

/* Compiled CSS */

#header {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}
#footer {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
}
于 2013-02-14T17:29:46.713 に答える
1

純粋な CSS を使用して、そのようにスタイルをセレクターに混在させることはできません。結果を達成することをお勧めする方法は、共有したいプロパティを持つクラスを作成することです。次に例を示します。

.red {
    color: red;
}

そして、そのクラスを赤にしたいすべての要素に適用します。どの HTML 要素にも、任意の数のクラスを含めることができます。

<div class="myCssRule1 myCssRule2"></div>

より良い方法 (私の意見では) は、CSS プリプロセッサを利用することです。これは、追加機能を提供する CSS によく似た言語ですが、通常の CSS スタイル シートにコンパイルされます。私のお気に入りはStylusですが、 LESS、Sass、およびCompassもチェックしてください。

于 2013-02-14T17:39:42.923 に答える
0

これを行うには、CSS プリプロセッサが必要です。最も人気があるのは Sass と LESS です。

于 2013-02-14T17:30:32.737 に答える