使用nth-child为第4项及以后的样式设置样式 [英] Using nth-child to style item 4 and onwards

问题描述

我有一个清单项目，我想要第4个项目，然后又要具有不同的 background-color 。

I have a list item where I'd like the 4th item and onwards to have a different background-color.

我尝试了以下操作：

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

此样式仅设置第4个样式。然后，我尝试了以下方法，希望它可以设置第4个项目及以后的样式，但不起作用：

This styles only the 4th item. I then tried the following in the hope that it would style 4th item and onwards, but it didn't work:

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

如何在不指定第4，第5，第6，第7等的情况下使它起作用。 ..？

How can I get this to work without having to specify 4th, 5th, 6th, 7th etc...?

推荐答案

使用 ：nth-​​child（n + 5） （CSS索引从1开始）。

Use :nth-child(n+5) (CSS indexes start at 1).

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

这篇关于使用nth-child为第4项及以后的样式设置样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！