如何使用CSS或jQuery来设计第一(顶级)li和最后(顶级)li？
我正在使用CSS设置第一个li风格，但也是在每个中等级别的ul中创建第一个li，所以我该如何才能使其只与主目录1中的li一起进行风格，最后一个使用Main 6？
这是我的代码：
<style>
ul li:first-child
{
width: 800px;
border:1px solid #fc5604; border-top-width:thin; (2px)
}
</style>
和HTML：
<div id="nav">
<ul>
<li><a href="#">Main 1</a>
<ul>
<li><a href="#">Sub 1a</a></li>
<li><a href="#">Sub 1b</a></li>
<li><a href="#">Sub 1c</a></li>
</ul>
</li>
<li><a href="#">Main 2</a>
<ul>
<li><a href="#">Sub 2</a></li>
</ul>
</li>
<li><a href="#">Main 3</a>
<ul>
<li><a href="#">Sub 3</a></li>
</ul>
</li>
<li><a href="#">Main 4</a>
<ul>
<li><a href="#">Sub 4</a></li>
</ul>
</li>
<li><a href="#">Main 5</a></li>
<li><a href="#">Main 6</a>
<ul>
<li><a href="#">Sub 6</a></li>
</ul>
</li>
</ul>
</div>
解决方法
你必须使用
immediate child selector：
ul > li:first-child
此规则将影响< li>这只是紧接着前面的< ul> ;.这应该适用于jQuery和css。并不是所有的浏览器都可以使用伪类(尤其是最后一个孩子)。
