10个 你可能不熟悉的 css伪类 及其用例介绍

css 伪类用于向某些选择器添加特殊效果，是动态的，是指当前元素的状态或特征。当一个元素达到特定状态时，它可能会得到一种伪类型的风格；当状态发生变化时，它就会失去这种风格。

本文在一定程度上鼓励您在构建UI时使用更简单的CSS和更少的CSS JS。熟悉 CSS 所提供的一切都是实现这一目标的一种方法，另一种方法是实现最佳实践，并尽可能多地重用代码。

接下来，我想介绍一些你可能不熟悉的伪类及其用例，希望对你以后有所帮助。

::first-line | 选择文本的第一行

::first-line 伪元素应用于某一元素的第一行。第一行的长度取决于许多因素，包括元素宽度、文档宽度和文本大小。

::first-line 假元素只能在块容器中，所以，::first-line伪元素只能在一个display值为block, inline-block, table-cell 或者 table-caption它是有用的。在其他类型中，::first-line 它不起作用。

用法如下：

p:first-line {
  color: lightcoral;
}

::first-letter | 选择这条线的第一个字

CSS 伪元素 ::first-letter选择某一级元素第一行的第一个字母。用法如下：