“css伪类”有哪些？

CSS伪类是用于选择HTML元素的特定状态或类型的特殊类。它们允许开发者为特定状态（如鼠标悬停、焦点、活动等）的元素应用样式。以下是CSS伪类的一些常见示例和描述：

1. :hover：此伪类用于选择鼠标悬停在其上的元素。例如，您可以使用它来更改鼠标悬停在链接上时的颜色或背景。

css

a:hover {

    color: red;

}

2. :active：此伪类用于选择被用户激活（例如，点击并按下）的元素。它常用于定义按钮点击时的样式。

css

button:active {

    background-color: green;

}

3. :focus：此伪类用于选择获得焦点的元素，如输入框或按钮。当用户与该元素交互时，可以使用此伪类来更改其样式。

css

input:focus {

    border-color: blue;

}

4. :first-child 和:last-child：这些伪类用于选择其父元素的第一个或最后一个子元素。例如，您可以使用它们来为列表项或段落等元素添加特定的样式。

css

p:first-child {

    font-weight: bold;

}

5. :nth-child()：这是一个更复杂的伪类，允许您根据其父元素的子元素顺序来选择元素。例如，您可以选择每个列表的第二个元素并将其设置为不同的颜色。

css

li:nth-child(2) {

    color: orange;

}

6. :not()：此伪类用于选择不符合其他特定选择器的元素。它是一个强大的工具，可用于为特定类型的非匹配项应用样式。

css

p:not(.ignore) {

    color: black; /* 除了 class 为 'ignore' 的 p 元素外的所有 p 元素 */

}

7. :link和 :visited：这些伪类用于选择未访问和已访问的链接。您可以为这两种状态定义不同的样式。

这只是CSS伪类的一部分，还有更多可以使用的伪类，如:before、:after等，这些通常与内容伪元素一起使用，为元素的内部部分（如内容之前或之后的伪元素）应用样式。CSS伪类提供了灵活的方式来根据元素的特定状态和交互方式应用样式，从而创建丰富和动态的网页界面。