css - 可以使用 :before pseudo-selector on itself?

Question

例如，像这样的东西:

HTML

<p>text</p>

CSS

p:before {
content: " 1";
}

p:before:before {
content: " 2";
}

最终会是这样的:

text 1 2

---

如果这不可能，是否有任何方法可以模拟相同的效果？

在我的元素中，我使用 font-size:0 隐藏了原始文本内容，并使用 :before 伪选择器在其中添加了彩色文本。

但是，它是 2 个单词，所以我希望能够在生成的内容之后添加更多内容以更改颜色。

“GLB 指南”是使用 :before 生成的，但我希望能够使两个词的颜色不同。

希望这是有道理的!

Answer 1

你想要像下面这样的东西让你的文字有两种不同的颜色:

p:before {
content: " GLB";
color: red;
}

p:after {
content: " Guide";
color: blue;
}

<p></p>