html - CSS不改变前两个字符的颜色

Question

HTML

<p class="required">*Required</p>

CSS

<style>
.required::first-letter {
 font-size: 200%;
 color: #8A2BE2;
}
</style>

这个 css 不只改变 '*' 的颜色，它改变了 '*R'。为什么？

.required::first-letter {
    font-size: 200%;
    color: #8A2BE2;
}

<p class="required">*Required</p>

Answer 1

::first-letter选择器用于给指定选择器的首字母添加样式。*是一个符号。

你可以使用::before

.required::before {
    content: '*';
    font-size: 200%;
    color: #8A2BE2;
}

<p class="required">Required</p>