当前位置： 首页 > 技术交流 > CSS2与CSS3中常用的伪类汇总大全
CSS2与CSS3中常用的伪类汇总大全
2021/08/30 10:23 分类： 技术交流 浏览：0
CSS2与CSS3中有非常多的伪类，可以用于实现各种强大的、酷炫的功能。有用于选择标签状态的，如：a:link a:hover input:checked input:focus等；也有用于根据结构选择标签的，如：li:first-child li:nth-child()等；甚至还有非常少用，但功能强大的，如：li:not() div:target等等。
CSS2的伪类大汇总：
E:link 动态伪类选择器，用于设置未访问的连接
E:visited 动态伪类选择器，用于设置已访问过的连接
E:hover 动态伪类选择器，用于设置鼠标移到标签上的效果
E:active 动态伪类选择器，用于设置鼠标点到连接上的效果
E:focus 焦点伪类选择器，用于设置输入框获取到焦点时的效果
E:lang(zh-cn) 语言伪类选择器，用于选择设置了对应语言的标签
E:first-child 结构伪类选择器，用于选择第一个子元素
CSS3的伪类大汇总：
E:last-child 结构伪类选择器，用于选择最后一个子元素
E:only-child 结构伪类选择器，用于选择仅有的一个子元素
E:nth-child(n) 结构伪类选择器，用于选择指定位置的某个元素
E:nth-last-child(n) 结构伪类选择器，用于选择倒数指定位置的某个元素
E:first-of-type 选择同类型中的第一个同级兄弟元素E
E:last-of-type 选择同类型中的最后一个同级兄弟元素E
E:only-of-type 选择同类型中的唯一的一个同级兄弟元素E
E:nth-of-type(n) 选择同类型中的第n个同级兄弟元素E
E:nth-last-of-type(n) 选择同类型中的倒数第n个同级兄弟元素E
E:empty 选择没有任何子元素的元素E
E:checked 用于设置单选与复选框的选中项样式
E:enabled 用于设置可用的输入框的样式
E:disabled 用于设置禁用的输入框的样式
E:target 目标伪类选择器，用于设置当前锚点匹配的目标样式
E:not(s) 否定伪类选择器，用于否定某个选择器
E:root 用于选择文档的根元素，html文档根元素永远是<html>标签
这里面有非常多平时较少用到，但是功能强大的伪类。下面以 :checked为例给大家演示一下复选框的样式重置效果。
复选框与单选框在网页中是不能被随意更改外形的，但是可以使用 :checked伪类模仿一个复选框，这样就可以设置成我们想要看到的效果，例如：
要如何实现呢？
赞 0
