如何使用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; } 

Answer 1

对于里面的第一个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 } 

Answer 2

这应该与IE8兼容（仅使用CSS 2.1select器）：

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

Answer 3

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

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

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