1

私はこのような4つの要素を持っています:

<div class="hover-border top"></div>
<div class="hover-border right"></div>
<div class="hover-border bottom"></div>
<div class="hover-border left"></div>

現在、私は次のように CSS を選択しています。

div.hover-border.right, div.hover-border.left {
    attribute: value
}

div.hover-border.top, div.hover-border.bottom {
    attribute: value
}

CSSセレクターを使用して1つのクラスでグループ選択を行う方法はありますか? 最初のクラス属性「hover-border」が一致する必要があり、括弧内の次のクラスのいずれかに一致する可能性がある場合、次のようなことを行うことはできますか:

div.hover-border.(right, left) {
    attribute: value
}

div.hover-border.(top, bottom) {
    attribute: value
}

ご協力いただきありがとうございます。それは大歓迎です！

4

3 に答える 3

3

私の知る限り、これを行う標準的な方法は次のとおりです。

div.hover-border {
    attribute: value
}

div.hover-border.top, div.hover-border.bottom {
    attribute: value
}

2 番目の規則の特異性は、「デフォルト」の最初の規則をオーバーライドします。

于 2013-05-17T09:25:29.827 に答える
0

、 などSASSのCSS フレームワークを使用することをお勧めします。セレクターの混合に適しています。LESSEmmet

于 2013-05-17T09:46:18.783 に答える