CSS не изменяя цвет первых двух Charactor

Question

HTML

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

CSS

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

Это CSS не изменяя цвет '*' только он меняет как «* R'.Why?

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

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

Answer 1

first::letter для letter и not for symbol

так что вы могли бы сделать это, как это.

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

CSS

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

FIDDLE DEMO

ИЛИ

вы можете использовать ::before

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

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

FIDDLE DEMO

Answer 2

::first-letter Селектор используется для добавления стиля к первой букве указанного селектора. * - символ.

Вы можете использовать ::before

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

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

Answer 3

Я думаю, это потому, что браузер будет применить стиль CSS от начала блока к первой букве, и она не думает, что " * - это письмо.

Почему бы вам не использовать :: before, а затем установить content = '*'?

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

} 

Answer 4

Если посмотреть на спецификации в http://www.w3.org/TR/css3-selectors/#first-letter, он говорит:

пунктуации (т.е. символы определены в Unicode в "открытом" (Ps), "близко" (Pe), «начальный» (Pi). «final» (Pf) и «other» (Po) классы пунктуации), который предшествует или следует за первой буквой, должен быть включен . [UNICODE]

Так звездочка должна быть включена (в "другой" (Po) пунктуации класса юникода), как и для спецификации. Вот почему он включен в ваш css.