在CSS3中,伪类选择器是用于选取DOM树之外的元素,或者是不能被常规CSS选择器选取的元素,它们以冒号(:)开头,后面跟着一个或多个标准或者自定义的关键字,以下是一些主要的CSS3伪类选择器:
1、:firstchild
这个伪类选择器匹配父元素的首个子元素。
2、:lastchild
这个伪类选择器匹配父元素的最后一个子元素。
3、:nthchild(n)
这个伪类选择器匹配父元素的第n个子元素。:nthchild(2)将匹配第二个子元素,:nthchild(odd)将匹配所有的奇数位置的子元素。
4、:firstoftype
这个伪类选择器匹配父元素的首个特定类型的子元素。
5、:lastoftype
这个伪类选择器匹配父元素的最后一个特定类型的子元素。
6、:nthoftype(n)
这个伪类选择器匹配父元素的第n个特定类型的子元素。
7、:onlychild
这个伪类选择器匹配父元素只有一个子元素时的那个子元素。
8、:onlyoftype
这个伪类选择器匹配父元素只有一个特定类型的子元素时的那个子元素。
9、:empty
这个伪类选择器匹配没有子元素的元素。
10、:target
这个伪类选择器匹配当前活动的链接(点击的链接)。
11、:not(selector)
这个伪类选择器匹配不符合括号内选择器条件的元素。
12、:checked
这个伪类选择器匹配被选中的input元素。
13、:enabled
这个伪类选择器匹配启用的表单元素。
14、:disabled
这个伪类选择器匹配禁用的表单元素。
15、:root
这个伪类选择器匹配文档的根元素。
16、:nthlastchild(n)
这个伪类选择器匹配父元素的倒数第n个子元素。
17、:nthlastoftype(n)
这个伪类选择器匹配父元素的倒数第n个特定类型的子元素。
18、:lang(language)
这个伪类选择器匹配指定语言的内容。
19、:right
这个伪类选择器匹配在右对齐的文本。
20、:left
这个伪类选择器匹配在左对齐的文本。
21、:placeholdershown
这个伪类选择器匹配当前显示占位符的输入框。
以上就是CSS3中的主要伪类选择器,它们提供了强大的功能,使我们能够更灵活地控制页面的样式和布局。
FAQs:
Q1: CSS3中的:firstchild和:firstoftype有什么区别?
A1: :firstchild匹配的是父元素的第一个子元素,无论该子元素的类型是什么;而:firstoftype匹配的是父元素的第一个特定类型的子元素,只有当该子元素的类型与指定的类型相匹配时才会被选中。
Q2: CSS3中的:nthchild(n)和:nthoftype(n)有什么不同?
A2: :nthchild(n)匹配的是父元素的第n个子元素,无论该子元素的类型是什么;而:nthoftype(n)匹配的是父元素的第n个特定类型的子元素,只有当该子元素的类型与指定的类型相匹配时才会被选中。
原创文章,作者:未希,如若转载,请注明出处:https://www.kdun.com/ask/651189.html
本网站发布或转载的文章及图片均来自网络,其原创性以及文中表达的观点和判断不代表本网站。如有问题,请联系客服处理。
发表回复