0

メディアクエリの下の要素と別のクラスの子孫に同じスタイルを定義する必要があります。

LESS での完全な解決策は、次の [疑似コード] です。

.foo
{
  color:red;

  .example &,
  @media (min-width:800px)
  {
    color:blue;
  }
}

次のようにコンパイルされることが望ましいはずです。

.foo {
  color: red;
}
.example .foo {
  color: blue;
}
@media (min-width: 800px) {
  .foo {
    color: blue;
  }
}

この構文は正しくありませんが、私の問題を解決するための提案はありますか?

4

3 に答える 3

1

いいえ、セレクターと@mediaクエリは言語エンティティが違いすぎるため ({}構文は似ていますが)、例のようにそれらをコンマと組み合わせることはできません。

したがって、それを DRY にするには (もちろん、共有スタイルに複数のプロパティがあると仮定して)、ミックスイン (またはそのようなもの) が必要になります。次に例を示します。

.foo {
    color: red;
    .somename() {
        color: blue;
    }

    .example &                {.somename}
    @media (min-width: 800px) {.somename}
}

ルールセットを Mixins に渡す例も参照してください(さらに一般的なソリューションが必要な場合)。

于 2014-11-13T03:02:10.077 に答える