使用css3的:nth-last-of-type()选择器选择同类型的倒数第n个元素

分类:知识百科 日期: 点击:0

CSS3的:nth-last-of-type()选择器

CSS3的:nth-last-of-type()选择器可以用来选择同类型的倒数第n个元素,它是CSS3新增的功能,可以替代旧版本的:last-of-type()选择器,它更加灵活,可以用来选择任意位置的元素。

使用方法

使用:nth-last-of-type()选择器,可以用下面的语法来实现:

element:nth-last-of-type(n) {
    // 要应用的样式
}

其中,element代表需要选择的元素,n代表倒数第几个元素,可以是任意正整数,比如1、2、3等。

例如,要选择同类型的倒数第二个元素,可以使用如下代码:

element:nth-last-of-type(2) {
    // 要应用的样式
}

:nth-last-of-type()选择器还支持使用表达式来选择元素,比如:

element:nth-last-of-type(2n+1) {
    // 要应用的样式
}

上面的代码表示,选择同类型的倒数第2n+1个元素,比如第1、3、5、7、9个元素等。

注意事项

  • :nth-last-of-type()选择器只支持CSS3,不支持旧版本的浏览器。
  • :nth-last-of-type()选择器只能用来选择同类型的元素,不能用来选择不同类型的元素。
  • :nth-last-of-type()选择器只能用来选择倒数第n个元素,不能用来选择正数第n个元素。
标签:

版权声明

1. 本站所有素材,仅限学习交流,仅展示部分内容,如需查看完整内容,请下载原文件。
2. 会员在本站下载的所有素材,只拥有使用权,著作权归原作者所有。
3. 所有素材,未经合法授权,请勿用于商业用途,会员不得以任何形式发布、传播、复制、转售该素材,否则一律封号处理。
4. 如果素材损害你的权益请联系客服QQ:77594475 处理。