css nth-child，每3 + 1，即：4,7,10,13等

Question

我一直试图解决这个问题，但没有成功 - 现在将其作为一个可行的占位符，但它很难......

.customField:nth-child(4), 
.customField:nth-child(7), 
.customField:nth-child(10), 
.customField:nth-child(13), 
.customField:nth-child(16) {
  clear: both;
}

如何在nth-child声明中获得此信息？

Answer 1

每个第3个孩子都是3n，但要从第4个孩子开始，请使用4作为偏移量。

div:nth-child(3n + 4) {
  color: red;
}

<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>
<div>asdf</div>

Answer 2

我相信:nth-child(3n+4)会奏效。

对于:nth-child(an+b)的给定值，一般格式为n，其中n为正数或零。