nth-child没有按预期工作

Question

我有使用问题nth-child(n).可以说我有这样的清单:

<ul>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

和风格:

li {
  margin: 0 10px 0 0;
}
li:nth-child(6n+6) {
  margin: 0;
}

出于某种原因,这种组合设置margin: 0每四个li元素.我想要实现的是每六分之一设置这个零利润li.你能告诉我我的css应该是什么样的吗？

Answer 1

6n+6意味着从6开始,然后从那一点开始每隔6次,所以6n在这种情况下使用是等效的:

li:nth-child(6n) {
    margin: 0;
}

此外,此资源非常有用:http://css-tricks.com/examples/nth-child-tester/

如果这不适合你,你的选择器是错误的.使用更具体的东西,body > ul > li:nth-child(6n)或者body > ul > li:nth-of-type(6n)只选择每个第6个li元素.