：第一个孩子定位所有子元素

Question

我有一个无序列表，其ID为“导航”和一些子列表项元素。

我想选择第一个项目与:first-child，但它是应用我用这个CSS到所有其他列表项目。

ul#navigation li:first-child{ 
    background:#fff; 
} 

因此，重申：这是给每个列表项目一个白色的背景。我只想选择第一个元素。出了什么问题？

Answer 1

根据该意见，你的问题是，您的标记看起来像这样：

<ul id="navigation"> 
    <a href="http://google.com"> 
     <li>Google</li> 
    </a> 
</ul> 

注意如何每li将这种模式下:first-child。我建议你在你的列表项目中使用更合适的嵌套锚点结构。如果你想锚，填补了列表项，设置其显示到块：

<ul id="navigation"> 
    <li><a href="http://google.com">Google</a></li> 
</ul> 

并结合CSS：

#navigation a { display: block } 

一旦你有了到位的结构性变化，你的选择应该定位第一个列表项：

/* > to target only immediate list items */ 
#navigation > li:first-child { 
    background: red; 
}