css :nth-child(an + b) 的坑

css 的 nth-child 已经不是什么新概念了
作用就是匹配其父元素的"某个"子元素
注: 第一个子元素的序号为 1

其实它还可以匹配"某些"子元素, 如:

:nth-child(odd) { /* 序号为奇数的子元素 */ }
:nth-child(even) { /* 序号为偶数的子元素 */ }

再拓展一下, 可以控制周长和偏移, 如:

p:nth-child(an + b){...}

使用公式 (an + b)。描述：a 表示周期的长度，n 是计数器（从 0 开始），b 是偏移值。

注意, n 的位置有严重要求, [ b+an, na+b ] 都是不合法的格式

通俗点说
a: 每隔 a 个, 匹配一个元素
n: 当是关键字就行, 用的时候就是写"n"; 数的时候就 第一次是 0, 第二次是 1, …
b: 从第 b 个开始

<!-- li:nth-child(3n+1) {...} -->
<ul>
	<li>3 * 0 + 1</li>
	<li></li>
	<li></li>
	<li>3 * 1 + 1</li>
	<li></li>
	<li></li>
	<li>3 * 2 + 1</li>
	<li></li>
	<li></li>
	<li>3 * 3 + 1</li>
</ul>

end