CSS選擇不具有類

我有一對夫婦的<div> S中的第一個元素，其中一些有class: hidden，像這樣：CSS選擇不具有類

<div id="firstDiv" class="hidden">content</div> 
<div id="secondDiv">content</div>

我知道要選擇具有第一<div>不是class: hidden。我到目前爲止在CSS：div:not(.hidden):first-child，但它不工作。

如何正確寫入選擇器？

來源

2013-10-01 luca

您當前的選擇器將捕獲沒有'.hidden'類的元素，**和**是某些元素的第一個子元素。 – avrahamcool

，你可以使用類似this

HTML

<div id="firstDiv" class="hidden">content</div> 
<div id="secondDiv">content</div> <!-- only this one will be selected --> 
<div id="thirdDiv">content</div>

CSS

div:not(.hidden) 
{ 
    background-color: red; 
} 
div:not(.hidden) ~ div:not(.hidden) 
{ 
    background-color: white; /*reset everything to normal*/ 
}

來源

2013-10-01 12:38:16 avrahamcool

+1尼斯答案，雖然它還沒有完全交叉兼容，我會相信嗎？ – MackieeE

爲什麼不呢？這是一個[有效的選擇器]（https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_selectors）。 – avrahamcool

https://developer.mozilla.org/en-US/docs/Web/CSS/:not For MackieeE

使用下一個兄弟選擇器+你可以寫一些東西，總是找到隱藏的div後隱藏的第一個div。

div.hidden + div:not(.hidden) 
{ 
    background-color: #ff0; 
}

http://jsfiddle.net/mbFFQ/

來源

2013-10-01 12:37:43

如果不隱藏是父項中的第一項？ – avrahamcool

好點，你的迎合 –

CSS選擇不具有類

回答

相關問題