css - クラスに基づいて less-css 関数をオーバーライドできますか?

Question

たとえば、私のhtmlタグには class がありie9ます。ie9デフォルトの関数を定義し、クラスが存在するときにその定義をオーバーライドしたい:

.word-break(){
    word-break: break-word;
}

.ie9 {
    .word-break(){
        word-break: break-all;
    }
}


div > p {
    .word-break();
}

ただし、これは意図したとおりには機能しません。IE9 では何も起こりません。

Answer 1

セレクターを mixin 内に配置する必要があります。

.word-break() {
    .ie9 & {
        word-break: break-all;
    }
}

は&、内部で mixin を呼び出しているセレクターを表します。

単純に と書く.ie9 {と が生成されますがdiv > p .ie9、これはおそらく望んでいるものではありません。
最後に配置&すると、元のセレクターが後で移動します。