css - クラスが2つの親クラスのいずれかの子である場合、クラスにルールを適用する方法は?

Question

.category-view私には両親がい.search-resultsます。

.special-priceそれらのそれぞれは、私がスタイリングしたい子供を持つことができます.

でもスタイリングはしたくない.product-view .special-price。

次のように複数のパスを綴る必要があります。

.category-view .special-price, .search-results .special-price {

}

または、次のような短い方法がありますか

.category-view/.search-results .special-price {

}

さらに、実際には .special-price と .old-price の両方をスタイルしたいのですが、それを行う方法はありますか? お気に入り

.category-view/.search-results .special-price/.old-price {

}

...どちらかの親より下にいる場合、それらの子供の両方に影響しますか?

Answer 1

これは最も信頼できる形式です:

.category-view .special-price,
.search-results .special-price,
.category-view .old-price,
.search-results .old-price {
/*STYLE*/
}

Answer 2

このようにする必要があります：

.category-view .special-price, .search-results .special-price {

}

「、」で区切られたセレクターをチェーンするよりも短い方法はありません

Answer 3

:notCSSセレクターを試してください：

.special-price:not(.product-view)
{
}

詳細: https://developer.mozilla.org/en-US/docs/Web/CSS/:not

JSFiddle: http://jsfiddle.net/b2bjJ/