伪类
CSS 伪类用于指定所选元素的特殊状态。
基本语法
css
selector:pseudo-class {
property: value;
}伪类分类
伪类分为好多种类，按照mdn的分类，主要分为以下几类：
- 动态伪类，比如
:hover、:active、:focus等 - 结构伪类，比如
:first-child、:last-child、:nth-child()等 - UI伪类，比如
:disabled、:checked、:valid等 - 语言伪类，比如
:lang()等 - 其他伪类，比如
:root、:not()、:empty、:target等
常用伪类
下面介绍几个常用的伪类：
:hover
:hover 伪类用于指定当鼠标悬停在元素上时的样式。
css
a:hover {
color: red;
}:active
:active 伪类用于指定当元素被激活时的样式，比如被点击时。
css
button:active {
background-color: blue;
}:first-child
css
ul li:first-child {
color: green;
}:disabled
:disabled 伪类用于选择禁用的元素，比如禁用的输入框或按钮。
css
input:disabled {
background-color: gray;
}:root
:root 伪类用于选择文档的根元素。对于 HTML 来说，:root 表示 <html> 元素，除了优先级更高之外，与 html 选择器相同。
css
:root {
background: yellow;
}在声明全局 CSS 变量时 :root 会很有用：
css
:root {
--main-color: hotpink;
--pane-padding: 5px 42px;
}