CSS结构伪类选择器

最新推荐文章于 2024-03-28 23:22:23 发布

yuh_c

最新推荐文章于 2024-03-28 23:22:23 发布

阅读量496

点赞数

CC 4.0 BY-SA版权

分类专栏： css3

本文链接：https://blog.youkuaiyun.com/yuh_c/article/details/51107784

6 篇文章

订阅专栏

本文深入探讨了前端开发领域的核心技术，包括HTML、CSS、JavaScript等基础知识，以及Vue、React、Angular等现代框架的应用。同时，文章还涉及前端工具如Webpack、Babel等的使用，为前端开发者提供了全面的技术指导。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

序号	选择器	功能描述	示例	备注
1	E:root	选择匹配元素E所在文档的根元素
2	E:nth-child(n)	选择在其父类中的第N个位置的匹配E的子元素	p:nth-child(2)：	tr:nth-child(3)匹配所有表格里拍第三行的tr元素； tr:nth-child(2n+1)=tr:nth-child(odd)匹配所有变革的奇数行； tr:nth-child(2n)=tr:nth-child(even)匹配所有变革的偶数行；
3	E:nth-last-child(n)	选择所有在其父元素中倒数第n个位置的匹配E的子元素
4	E:nth-of-type(n)	选择所有在其父类元素中的同类型的第n个位置的匹配E的子元素	p:nth-of-type：
5	E:nth-last-of-type(n)	选择所有在其父类元素中的同类型倒数第n个位置的匹配E的子元素
6	E:last-child	选择位于其父元素中的最后一个位置，且匹配E的子元素		如果父元素的最后一个元素不是E则样式不起作用
7	E:first-of-type	选择在其父元素中匹配E的第一个同类型的子元素
8	E:only-child	选择其父元素只含有一个子元素，且该子元素匹配E。	p:only-child	匹配:<div><p></p></div> 不匹配:<div><h1></h1><p></p></div>
9	E:only-of-type	选择其父元素只含有一个同类型的子元素，且该子元素匹配E。	p:only-of-type	匹配:<div><p></p></div> 匹配:<div><h1></h1><p></p></div> 不匹配：<div><p></p><p></p></div>
10	E:empty	选择匹配E的元素，且该元素不含有子节点