一、用于链接，按钮等元素的常见伪类
:active 常见于用户点击按钮和松开按钮之间的样式
:visited 常用于链接被访问之后的样式
:link 一个链接未被点击时的样式
二、用于可获取焦点的元素的常见伪类
:focus 可输入内容的标签选中时的元素样式
:focus-within 当他的后代出现光标时触发该样式
三、用于打印时的常见伪类
:first 打印文档的时候，第一页的样式。用于@page
:left 用于打印时的左侧样式
:right 用于打印文档的所有右页
四、用于指定元素的常见伪类
:first-child 表示在一组兄弟元素中的第一个元素。
:first-of-type 表示一组兄弟元素中其类型的第一个元素
:last-child 代表父元素的最后一个子元素。
:last-of-type 表示了在（它父元素的）子元素列表中，最后一个给定类型的元素
:not() 用来匹配不符合一组选择器的元素。
:nth-child() 匹配到的元素集合（n=0，1，2，3...）
:nth-last-child() 这个CSS 伪类 从兄弟节点中从后往前匹配处于某些位置的元素
:nth-last-of-type() 从结尾处反序计数
:nth-of-type 针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置
:only-child 匹配没有任何兄弟元素的元素
:only-of-type 匹配没有其他相同类型的兄弟元素
五、与鼠标相关的伪类
:hover 鼠标悬浮在某个元素上时的样式
六、其他伪类
:checked 表示处于选中状态是的radio、chexkbox等元素的状态
:default 表示处于默认值时的元素状态，常见于radio option等
:dedined 用于定义好的元素上。常见于自定义元素标签
:empty 当元素没有子元素时采用此样式
:enadled 用于能被激活或者能获取焦点的元素
:host 用于shadowDOM 不常见
:indeterminate 用于状态不确定的元素，比如正在编辑中的input或者正在改变中的progress元素
:in-range 用于input标签的内容在限定的min和max中的样式
:out-of-range 用于input标签的内容超出min和max时的样式
:lang() 根据语言确定一些符号
:optional 用于没有表示必填的一些元素属性
:read-only 表示元素不可被用户编辑的状态
:read-white 代表可被用户编辑的元素的样式
:root 相当于 html不过比html标签选择器权重更高
:target 常用于点击跳转套页面指定id元素时的样式
:valid 内容符合要求时的元素样式
版权声明
文章来自网络，如无特殊说明或标注，均为本站原创发布。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。