如何使用cssselect第一个2 <li>元素

嗨,我想申请CSS前2个元素(一,两个)是相邻的第一个<p>元素。

 <div class="one"> <ul> <p> <li>One</li> <li>Two</li> <p> <li>Four</li> <li>Five</li> </ul> </div> 

适用于所有4 li元素

 .one ul p:nth-child(odd) ~ li { background: lightsteelblue; } 

对于里面的第一个2 li元素请尝试:

 .one ul li:nth-child(-n+3){ // your style } 

jsfiddle

正如其他队友提到的:你有无效的标记。

如果您删除了p元素,请尝试:

 .one ul li:nth-child(-n+2){ // your style } 

jsfiddle

更新:我的build议是使用另一个ul而不是p :所以你有有效的标记和相同的结果:

HTML

 <div class="one"> <ul> <li>0</li> <li> <ul> <li>One</li> <li>Two</li> <li>3</li> </ul> <li> <li>Four</li> <li>Five</li> </ul> </div> 

CSS:

 .one ul { padding: 0; list-style-type: none; } .one ul ul li:nth-child(-n+2){ // your style } 

更新了jsfiddle

注意:如果你只有2个特殊的li元素,为什么不简单的定义一个类名? <li class="bold">

 ul li.bold { // your style } 

这应该与IE8兼容(仅使用CSS 2.1select器):

 li:first-child, li:first-child+li { color: blue; } 

前三个元素,你可以select例如

 ul li:nth-of-type(-n+3) { } 

但是和其他人一样,你的标记是无效的,你一定要纠正它。