伪类选择器用来描述一个元素的特殊状态例如第一个元素、被点击的元素、含有指定属性值的选择器,通常用:开头前边有其他选择器
(1)、结构伪类选择器
1、根据所有子元素进行排序
:first-child 第一个元素
:last-child 最后一个元素
:nth-child 选中第n个元素 特殊值:2n/even偶数位元素 2n+1/2n-1/odd奇数位元素 n是一个大于0的整数
:nth-last-child 倒着数第n个元素
:only-child 只有一个子元素时生效
2、根据所有相同类型的子元素进行排序
:first-of-type 第一个元素
:last-of-type 最后一个元素
:nth-of-type 选中第n个选择器
:nth-last-of-child 倒着数的第你个选择器
:only-of-type 只有一个同类型的元素
3、 :root 匹配根元素的选择器 效果类似*通配符但它控制的样式都属于继承所以优先级最低
:empty 匹配没有子元素的选择器
(2)目标伪类选择器
:target 匹配被指向的元素,通常配合a标签使用,给a的锚点或指向的链接设置:target来实现相应的样式(不是给a设置而是给被指向的元素设置)
(3)UI元素状态伪类元素器
1、form表单中的
:checked 表示选中的状态
:disabled 表示禁用状态
:enabled 表示可以状态
2、通用的
:selection 选中状态或者高亮状态
(4)否定伪类选择器
:not()取消元素的状态,括号里可以写多个元素用,连接
(5)动态伪类选择器
:link 为访问过的链接
:hover 鼠标移入的状态
:active 鼠标点击的状态
:visited 访问过的链接
:focus 获取焦点时的状态
前四个还可以叫做伪链接选择器