如何设置3 li元素的倍数

Question

我想只设计三个“li”元素的多个.. 怎么做？

HTML：

 <div class="test">
 <ul>
    <li>content</li>
    <li>content</li>
    <li>content</li>
    <li>content</li>
    <li>content</li>
    <li>content</li>
    <li>content</li>
    <li>content</li>
 </ul>

</div>

的CSS：

 .test ul li:nth-child(n+3){background:#000;}

Answer 1

如果您想从第三个:nth-child(3n)元素开始，可以:nth-child(3n+3)或li执行此操作

＆＃13;

＆＃13;

ul li:nth-child(3n+3) {
  background: blue;  
}

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;

或:nth-child(3n)如果你想从第一个元素开始

＆＃13;

＆＃13;

ul li:nth-child(3n+1) {
  background: blue;
}

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;

Answer 2

这就是你要找的东西：

.test ul li:nth-child(3n) {
    background:#000;
}