MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

:nth-last-of-type

概述

:nth-last-of-type(an+b) 这个 CSS 伪类 匹配那些在它之后有 an+b-1 个相同类型兄弟节点的元素,其中 n 为正值或零值。它基本上和 :nth-of-type 一样,只是它从结尾处反序计数,而不是从开头处。

可以在 :nth-child 中查看关于语法参数更详细的描述。

语法

:nth-last-of-type( <nth> )

where
<nth> = <an-plus-b> | even | odd

示例

HTML

<div>
  <span>This is a span.</span>
  <span>This is another span.</span>
  <em>This is emphasized.</em>
  <span>Wow, this span gets limed!!!</span>
  <strike>This is struck through.</strike>
  <span>Here is one last span.</span>
</div>

CSS

span:nth-last-of-type(2) {
  background-color: lime;
}

Result

规范

规范 状态 备注
Selectors Level 4
:nth-last-of-type
Working Draft Matching elements are not required to have a parent.
Selectors Level 3
:nth-last-of-type
Recommendation Initial definition.

浏览器兼容性

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.0 (Yes) 3.5 (1.9.1) 9.0 9.5 3.2
Feature Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 2.1 (Yes) 1.0 (1.9.1) 9.0 10.0 3.2

相关资料

文档标签和贡献者

标签: 
 此页面的贡献者: PoppinL
 最后编辑者: PoppinL,