具有自动颜色选择的N个孩子？

Question

我有一个包含几个<li>项的导航。

每个<li>都有自己的类(nav-1，nav-2等等)

现在我想给每个类一个不同的背景色。

有没有办法在一个css-标记中做到这一点？

因为随着时间的推移，我的菜单会越来越长，我不想把我的手放在每一个变化。例如，类似

color: #eee +X;

Answer 1

CSS中有counters，但是不可能使用attr()收回计数器的值，然后将该值插入calc()。

如果它足够你，你可以循环，例如，五种颜色。代码应该是这样的。

li:nth-of-type(5n+1) { color:#000; }
li:nth-of-type(5n+2) { color:#333; }
li:nth-of-type(5n+3) { color:#666; }
li:nth-of-type(5n+4) { color:#999; }
li:nth-of-type(5n)   { color:#CCC; }

或者您可以使用javascript (可能是jQuery)来完成这项工作。