css3选择器nth-of-type,:nth-last-of-type,:first-of-type,:last-of-type,:only-of-type

1,:nth-of-type(n) 匹配属于父元素的特定类型的第N个子元素

分享图片

匹配结果:

分享图片

2, :nth-last-of-type(n),匹配其父元素下的第N个特定类型的子元素,从后往前

满足条件:1,必须是特定类型    2,从后往前的第N个

3,:first-of-type 

分享图片

分享图片

4,  :last-of-type 匹配其父元素下的最后一个特定类型的子元素

         body div:last-of-type 满足条件,body下的所有DIV元素,最后一个DIV

5, :only-of-type 选择其父元素上的唯一一个相同类型的子元素

分享图片

分享图片

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效