本文介绍了CSS3选择器问题,除了首先选择的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
使用以下标记,我想要一个CSS选择器选择除每个选项div中的第一个选择菜单,其中可能有很多:
< div class =options>
< div class =opt1>
< select title =请选择保修>
< option value =>选择保全< / option>
< option value =1> 1年保证< / option>
< option value =2> 3年保证< / option>
< / select>
< / div>
< div class =opt2>
< select title =请选择颜色>
< option value =>选择颜色< / option>
< option value =1>红色< / option>
< option value =2>蓝色< / option>
< / select>
< / div>
< div class =opt3>
< select title =请选择大小>
< option value =>选择大小< / option>
< option value =1>小< / option>
< option value =2>大< / option>
< / select>
< / div>
< / div>
我在Prototype中使用它,它几乎完全支持css3选择器,所以不受浏览器支持。 / p>
初始选择器应该是这样:
div.options div选择
我已经尝试了 nth-child
和:not(:first-child)
,但似乎无法使其正常工作。
解决方案
请参阅:
.options> div:not(:first-child)select {background:yellow;}
With the following markup i want a CSS selector to select all but the first select menu within each options div - of which there may be many:
<div class="options">
<div class="opt1">
<select title="Please choose Warranty">
<option value="">Select Waranty</option>
<option value="1">1 year guarantee</option>
<option value="2">3 year guarantee</option>
</select>
</div>
<div class="opt2">
<select title="Please choose Color">
<option value="">Select Color</option>
<option value="1">Red</option>
<option value="2">Blue</option>
</select>
</div>
<div class="opt3">
<select title="Please choose Size">
<option value="">Select Size</option>
<option value="1">Small</option>
<option value="2">Big</option>
</select>
</div>
</div>
I am using this within Prototype which has almost full css3 selector support so not concerned by browser support.
The initial selector would be something like:
div.options div select
I've tried a few variations on nth-child
and :not(:first-child)
but can't seem to make it work.
解决方案
See: http://jsfiddle.net/uDvEt/1/
.options > div:not(:first-child) select { background:yellow;}
这篇关于CSS3选择器问题,除了首先选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!