要素の宣言から親を選択してください

Question

Modernizrのようないくつかのライブラリを使用すると、htmlタグに、別のブラウザ機能を持ついくつかのクラスが入ります。たとえば、cssを変換できない場合、htmlタグはクラスno-csstransformsを取得します。 は、私は何をしたい例えば、要素のCSSプロパティを記述するために、それらをhtmlのクラスに基づいて分割されます。

.my-element { 

[SomethingThatCanSelectAparent]html.csstransforms & { 
     // i can do transforms to this element 
} 
[SomethingThatCanSelectAparent]html.no-csstransforms & { 
    /// whatever you want do for older browsers 
} 

} 

私はhtml.whaterver { .my-element }から始めることができることを知っているが、大規模なサイトでは、それは非常に迷惑になります

どうすればこのようなクリーンな方法で達成できますか？

Answer 1

あなたは正しいですが、アプローチはちょっと奇妙です。

これは主に、<などのようなparentセレクタのようなものがCSSに存在しないためです。

// Declaring the top of the DOM first 
html.css-transforms { 
    // Specific element when DOM has class x 
    .my-element { 
     // transformations! 
    } 
} 

// And when the HTML has no such thing, 
html.no-css-transforms { 
    // Give this styling. 
    my-element { 
     // no transformations :(
    } 
} 

をこれはhtmlタグのクラスに基づくmy-elementにスタイルを適用します（CSSがするMENTであるとして）だから、意味している古典的に落ちるする必要があります。

あなたがこのようなアンパサンドでこれを達成することができるはずです、しかし、SASSとLESSでutilizing the ampersand (&) with LESS.

.my-element { 

    html.css-transforms & { 
     // Magic css transforming 
    } 
} 

Answer 2

可能です：

.your-element { 

    color: red; 

    html.csstransforms & { color: blue; } 

} 

そして、これの出力は次のようになります。

.your-element { color: red; } 
html.csstransforms .your-element { color: blue; } 

EDIT：

申し訳ありませんが、最初は間違った質問を読んで、SASSの回答をお送りしましたが、同じことも少なくて済みます。