nth-child不准确是因按父元素所有子元素统一编号，含空白文本节点和注释；应改用:nth-of-type(odd/even)或通过开发者工具确认真实序号后推导an+b公式。
当 在浏览器开发者工具中右键目标元素 → “Edit as HTML”，观察它在父元素内的实际位置（包括隐藏的文本节点）。常见干扰源： 如果只想选中某类标签的奇偶项（如所有 注意： 立即学习“前端免费学习笔记（深入）”； 若必须用 通用解法： 避免因空白节点导致序号偏移： 不复杂但容易忽略——先看清结构，再选对伪类，最后用公式校准。nth-child 选中奇数或偶数元素不准确，通常不是语法写错，而是忽略了它**按父元素下所有子元素统一编号**的特性——它不区分标签类型，只看位置序号。比如父容器里混有 、注释、文本节点（如换行空格）时，目标元素的实际序号就和视觉顺序不一致。确认目标元素的真实序号
、）占位用
:nth-of-type() 替代（更直观） 的奇数项），用 :nth-of-type(odd) 更可靠——它只计算同类型兄弟元素：ul li:nth-of-type(odd) { background: #f0f0f0; } /* 只统计 li，忽略其他兄弟 */nth-of-type 不支持自定义公式如 2n+1 的简写别名（odd/even 可用），但功能上更贴近“视觉奇偶”预期。用
nth-child(an+b) 精确匹配位置nth-child，需根据真实序号反推公式。例如：目标 实际位于父元素第 3、6、9… 个位置（即每 3 个出现一次，从第 3 个开始），则写：li:nth-child(3n) { /* 匹配第 3、6、9... 个子元素 */ }
a = 3，首项 b = 2 → 公式为 3n-1（因 n 从 1 开始，3×1−1=2）li:nth-child(3n-1)
清理 DOM 结构减少干扰
font-size: 0 在父容器上，子元素再设正常字号（慎用，影响可访问性）
