1

modernizr を使用すると、タグに追加rgbaまたはno-rgbaクラス化されます。htmlを使用してミックスインを生成しようとしていLESSます。例えば:

.background-content{
  background: #000;
  background: rgba(0,0,0,0.5);
}

header{
  .background-content;
}

今、私がやろうとしているのは、rgba存在する場合です:

.background-content{
  background: rgba(0,0,0,0.5);
}

しかし、もしno-rgba存在するなら、私はそれを次のようにしたい:

.background-content{
  background: #000;
}

私の質問は、条件を使用してミックスインを生成することは可能ですか? .background-content内部headerで行うと、存在するクラスに応じて異なる背景色になりますか? LESSできないならできるSASS

4

1 に答える 1

3

プリプロセッサが HTML について、またはブラウザによってどのように読み取られているかを知ることはできません。ただし、私の理解が正しければ、必要なもの (およびそれ以上) を Sass で取得できます。

@mixin background-content {
  background: rgba(0,0,0,0.5);
  .no-rgba & { background: #000; }
}

header {
  @include background-content;
}

引数を取ることで、さらに柔軟にすることができます。

@mixin background-content($rgba, $no-rgba: rgba($rgba,1)) {
  background: $rgba;
  .no-rgba & { background: $no-rgba; }
}

header {
  @include background-content(rgba(0,0,0,0.5));
}

条件は、毎回ハードコーディングする必要がなく、ミックスイン内にあります。

于 2012-09-12T07:35:03.107 に答える