伪类选择器汇总

创新互联公司主要从事成都做网站、成都网站制作、网页设计、企业做网站、公司建网站等业务。立足成都服务月湖,十年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:028-86922220

1. 结构性伪类选择器

结构性伪类选择器主要用于选取DOM树中特定位置的元素。

伪类选择器	描述
`:root`	选取文档的根元素，即HTML元素
`:nthchild(n)`	选取父元素的第n个子元素
`:firstchild`	选取父元素的第一个子元素
`:lastchild`	选取父元素的最后一个子元素
`:nthlastchild(n)`	选取父元素的倒数第n个子元素
`:onlychild`	选取没有兄弟元素的子元素，等价于`:nthchild(1):nthlastchild(1)`
`:firstoftype`	选取兄弟元素中的第一个同类型的元素
`:lastoftype`	选取兄弟元素中的最后一个同类型的元素
`:nthoftype(n)`	选取兄弟元素中的第n个同类型的元素
`:onlyoftype`	选取没有兄弟同类型元素的子元素，等价于`:nthoftype(1):nthlastoftype(1)`
`:empty`	选取没有子元素的元素
`:nthmatch(selector, n)`	选取匹配给定选择器的第n个元素
`:nthlastmatch(selector, n)`	选取匹配给定选择器的倒数第n个元素
`:is(selector), :matches(selector)`	选取匹配给定选择器的元素
`:not(selector)`	选取不匹配给定选择器的元素
`:has(selector)`	选取包含指定后代的元素
`:contains(text)`	选取包含指定文本的元素（注意：这个选择器已被废弃，不再推荐使用）

2. UI状态伪类选择器

UI状态伪类选择器主要用于选取具有特定UI状态的元素。

伪类选择器	描述
`:enabled`	选取可用的表单元素
`:disabled`	选取不可用的表单元素
`:checked`	选取被选中的复选框、单选框或选项元素
`:default`	选取默认被选中的复选框、单选框或选项元素
`:indeterminate`	选取不确定状态的复选框、单选框或选项元素
`:focus`	选取当前获得焦点的元素
`:hover`	选取鼠标悬停的元素
`:active`	选取被用户激活的元素
`:selection`	选取被用户选定的文本（注意：这个选择器已被废弃，不再推荐使用）

3. 动态伪类选择器

动态伪类选择器主要用于选取处于特定动态状态的元素。

伪类选择器	描述
`:link`	选取未访问过的链接
`:visited`	选取已访问过的链接
`:hover`	选取鼠标悬停的链接
`:active`	选取被用户激活的链接
`:target`	选取当前活动的锚点元素（点击后跳转到的页面内的目标元素）

4. 表单相关伪类选择器

表单相关伪类选择器主要用于选取与表单相关的特定元素。

以上就是一些常用的伪类选择器的归纳，希望对你有所帮助。

网站建设、网络推广公司-快上网，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：快上网

成都快上网为您推荐相关内容