如何使用CSS伪类:nth-last-child实现从后往前定位特定元素？

本文共计962个文字，预计阅读时间需要4分钟。

它仅对父元素的直接子元素生效，并按+DOM+顺序从前向后遍历，不区分标签名或类名。常见错误包括它可能跨层级或自动跳过++。

• 必须是同一父级下的兄弟节点，嵌套子元素不会被计入计数
• 所有子节点都参与计数（包括 <span>、<p>、文本节点——但纯文本节点在大多数浏览器中不被 :nth-last-child 匹配）
• 如果父元素里混有注释节点或空格文本节点，旧版 Safari 可能行为不一致，建议用 :nth-last-of-type 替代

nth-last-child(2) 和 nth-last-of-type(2) 差在哪

前者数“第几个子”，后者数“第几个同类型子”。比如父元素有 <h2>、<p>、<p>、<div>，那么 :nth-last-child(2) 匹配第二个从后往前数的子元素（即 <p>），而 :nth-last-of-type(2) 匹配倒数第二个 <p>（如果只有一个 <p> 就不匹配）。