css伪类/伪元素

CSS伪类和伪元素是一种CSS选择器，它们允许我们选择不在文档树中的特定部分，并对其进行样式化。

**CSS伪类**

CSS伪类用于在某些状态下选择元素。常见的伪类包括：

- :hover - 当鼠标悬停在元素上时。
- :active - 当元素被激活或选中时（通常是通过点击）。
- :focus - 当元素获得焦点时（例如，通过使用tab键导航）。
- :checked - 用于选择已经被选中的表单元素。
- :nth-child() - 选择某个父元素下的第n个子元素。

使用伪类可以增加用户体验，并提供更细粒度的控制，以实现更丰富的效果。

**CSS伪元素**

CSS伪元素允许我们创建在文档树中不存在的元素，并在其上应用样式。常见的伪元素包括：

- ::before - 在元素之前插入一个虚拟的元素。
- ::after - 在元素之后插入一个虚拟的元素。
- ::first-letter - 为文本块的第一个字母应用样式。
- ::first-line - 为文本块的第一行应用样式。

使用伪元素可以帮助我们在网页中创建更复杂、更有趣的样式效果，同时使得HTML结构更加简洁明了。