我们有一个HTML代码段
<div id="parent">
<div id="ch1"></div>
<div id="ch2"></div>
<div id="ch3"></div>
....
<div id="ch1234"></div>
</div>
那么如何编写一个CSS选择器,它将特定样式应用于div#parent
除div#ch1
之外的任何子项?
答案 0 :(得分:2)
使用儿童和兄弟组合器:
#parent > div + div
其中div + div
表示任何div
跟随另一个~
,这将排除第一个孩子。
备选方案包括+
代替#parent > div ~ div
:
#parent > div:nth-child(n+2)
#parent > div:not(#ch1)
或者,使用CSS3伪类(在IE8及更旧版本中不支持,如果这对你很重要):
{{1}}
答案 1 :(得分:1)
你应该申请:
#parent div:nth-child(n+2) {
...
}
除了第一个之外,这将适用于每一个李,无论你有多少李。
顺便说一下,对于这些情况http://nth-test.com/
,这是一个不错的网站答案 2 :(得分:1)
您需要使用:not selector:
#parent :not(#ch1) {
styles
}
答案 3 :(得分:1)
不使用任何id
,如大多数答案所示.....只需使用parent
ID ...您可以这样使用它:
#parent div:nth-child(1) ~ div
{
/*design here*/
}
定位div
的第一个孩子parent
,然后使用~
为不是第一个孩子的孩子使用css设计!!
答案 4 :(得分:0)
只需添加要添加更改的类并定义该类
即可 <div id="parent">
<div id="ch1"></div>
<div class='myTest' id="ch2"></div>
<div class='myTest' id="ch3"></div>
....
<div class='myTest' id="ch1234"></div>
</div>
.myTest{color:red}
希望这有帮助。