CSS 是否有第二个字母的伪元素

Question

我正在为字母使用 CSS 样式来更改第一个第二个第三个字母的颜色。

像这样：

.header .logo h1 > a:first-letter {
  color: #f91ea5;
}

但我不知道如何更改第二个和第三个字母的颜色，它没有第二个字母元素。

Answer 1

我认为，您不能将伪元素用作:second-letter或:third-letter 。 这是设计使然。 但如果真的有必要，那么使用 JavaScript，例如： this或this 。

Answer 2

不，在Selectors Level 3甚至Selectors Level 4草案中，没有第二个或第三个字母的选择器。 （如果甚至会有这样的选择器，它们很可能会遵循:nth-child(...) 。）

您可以做的是将字母包装在文本级容器中，例如

<a ...>A<span class=second>C</span><span class=third>M</span>E</a>

然后你可以使用普通的类选择器，比如.second 。