css选择根据n倍数的子元素来设置样式

在做网站过程中，想要在子元素列表中，根据子元素所在序号的倍数来设置指定样式，应该如何实现呢，可以通过css第n倍数来选择子元素，设置想要的样式。具体方法如下：

<ul class="test">
<li>我是第1个子元素</li>
<li>我是第2个子元素</li>
<li>我是第3个子元素</li>
<li>我是第4个子元素</li>
<li>我是第5个子元素</li>
<li>我是第6个子元素</li>
<li>我是第7个子元素</li>
<li>我是第8个子元素</li>
</ul>

举例，让第4和和4倍数的子元素设置外间距为10px，可以用如下CSS：

<style>

.test li:nth-child(4n){
    margin:10px;

}
</style>
说明：4n就是4倍数的子元素都设定这个样式

通过上面的代码就可以实现第四个li的外间距为10px，同时4的倍数，第八个li的外间距也会被设置为10px。如果你有遇到类似的需求就试试看吧。