CSS nicht Farbe der ersten beiden charactor

Question

HTML Ändern

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

CSS

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

Diese CSS nicht nur Farbe von '*' zu ändern, ändert sich beide ‚* R'.Why?

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

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

Answer 1

first::letter ist für letter und not for symbol

so könnte man das so machen.

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

CSS

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

FIDDLE DEMO

ODER

können Sie ::before

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

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

01 verwenden

FIDDLE DEMO

Answer 2

Der ::first-letter Selektor wird verwendet, um einen Stil auf den ersten Buchstaben des angegebenen Selektor hinzuzufügen. * ist ein Symbol.

können Sie verwenden ::before

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

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

Answer 3

Ich denke, es ist, weil der Browser die CSS-Stil von Anfang des Blocks auf den ersten Buchstaben gelten, und es glaubt nicht, dass ' * 'ist ein Brief.

Warum verwenden Sie :: vor und dann content = '*'?

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

} 

Answer 4

Wenn Sie bei der Spezifikation in http://www.w3.org/TR/css3-selectors/#first-letter aussehen, heißt es:

Interpunktion (dh in Unicode definierte Zeichen in der "offenen" (Ps), "close" (Pe), "initial" (Pi). "final" (Pf) und "andere" (Po) Interpunktionsklassen), die dem ersten Buchstaben vorangehen oder folgen, sollte enthalten sein. [UNICODE]

Also das Sternchen sollte (ist in der "anderen" (Po) Interpunktion Klasse von Unicode) enthalten sein, wie für den spec. Deshalb ist es in Ihrem CSS enthalten.