選擇器匹配不嵌套在另一個選擇器中的元素？

我有一堆的div我窩隨意：選擇器匹配不嵌套在另一個選擇器中的元素？

<div> 
    <div> 
    <div>Apple</div> 
    <div> 
     <div>Banana</div> 
     <div>Grape</div> 
    </div> 
    </div> 
    <div>Craisin</div> 
</div>

我讓自己的內容粉紅色，像這樣的規則：

div { color: pink; }

我希望能夠給special類添加到任何那些div s取消了它的粉紅色規則及其所有子女。例如，如果我的special類添加到這個格，

<div> 
    <div class="special"> 
    <div>Apple</div> 
    <div> 
     <div>Banana</div> 
     <div>Grape</div> 
    </div> 
    </div> 
    <div>Craisin</div> 
</div>

那麼「蘋果」，「香蕉」和「葡萄」應該不再是粉紅色。

我可以調整我的規則，只匹配沒有嵌套在.special內的div嗎？

我不想找一個解決方案，包括編寫.special的規則，該規則取消了在div上定義的每種樣式。例如，這是不是即使它的工作原理很好的解決方案：

.special, .special div { color: black !important; }

我的實際風格不僅僅是改變顏色更加複雜，並有與像div span選擇其他規則，我也想禁用與special類。

來源

2012-02-21 alltom

您無法使用CSS阻止子/後代繼承可繼承的樣式屬性。

後代的樣式屬性必須被明確地重置。

來源

2012-02-21 22:20:50

所以沒有辦法寫'.div：noparents（.special）'這樣的東西？ – alltom 2012-02-22 03:15:37

@alltom你不能選擇一個孩子，然後是父母。「父選擇器」不存在於CSS中。實現此目的的唯一方法是：'div {color：red;} div.special，.special div {color：black;}'（假設黑色是默認顏色）。 – 2012-02-22 09:04:52

選擇器匹配不嵌套在另一個選擇器中的元素？

回答

相關問題