CSS3 nth-child（）每5个元素重复一次

Question

每5个元素可以选择一个元素范围吗？我期待的是：

<ul>
   <li>Test</li>
   <li>Test</li> //this
   <li>Test</li> //this
   <li>Test</li> //this
   <li>Test</li>
   <li>Test</li>
   <li>Test</li> //this
   <li>Test</li> //this
   <li>Test</li> //this
   <li>Test</li>
</ul>

从2到4，从7到9等

提前致谢！

Answer 1

由于您的范围的格式为[5 n - 3,5 n - 2,5 n - 1]（其中 n ≥1），使用以下代码：

＆＃13;

＆＃13;

li:nth-child(5n - 3), li:nth-child(5n - 2), li:nth-child(5n - 1) {
  color: red;
}

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;