使用 nth-child 设置项目 4 及以后的样式答案

【问题标题】：Using nth-child to style item 4 and onwards使用 nth-child 设置项目 4 及以后的样式
【发布时间】：2012-03-27 10:56:05
【问题描述】：

我有一个列表项，我希望第 4 项及以后的项具有不同的background-color。

我尝试了以下方法：

li:nth-child(4) { background-color:blue; }

这仅对第 4 项进行样式设置。然后我尝试了以下方法，希望它可以设置第 4 项及以后的样式，但没有成功：

li:nth-child(4+) { background-color:blue; }

如何在不指定第 4、第 5、第 6、第 7 等...的情况下使其工作？

【问题讨论】：

【解决方案1】：

使用:nth-child(n+5)（CSS 索引从 1 开始）。

演示：http://jsfiddle.net/nTZrg/1/

li:nth-child(n+5) {
    background-color:blue;
}

【讨论】：

【解决方案2】：

你需要这样做

li:nth-child(n+5) { background-color:blue; }

【讨论】：