Warum drucke ich »statt»?

Question

Ich möchte nur zeigen: », aber » wird stattdessen angezeigt. Warum wird Â hinzugefügt? Wie kommt es, dass es nicht nur der Doppelpfeil ist? Was ist falsch an meinem Code?

CSS

#buttonServices1{ 
    transition: all 0.5s; 
} 


#buttonServices1 span { 
    transition:0.5s; 
} 

#buttonServices1 span:after { 
    content: '»'; 
    transition: 0.5s; 
} 

#buttonServices1:hover span { 
    padding-right: 25px; 
} 

#buttonServices1:hover span:after { 
    opacity: 1; 
} 

HTML:

<button id="buttonServices1"><span>Services</span></button> 

Bild:

Answer 1

Die CSS content property erfordert Unicode Hex Escapes

content: '\00bb', 

Hier i s ein nützliches Diagramm von ihnen https://css-tricks.com/snippets/html/glyphs/

Answer 2

Es ist ein Rendering-Fehler mit dem Charakter Rendering sein könnte.

Das erste, was der erste, stellen Sie sicher, dass in Ihrem Kopf-Tags Sie so etwas wie dieses:

<meta charset="utf-8"> 

Dann versuchen, die Zeichen in dem Attribut Inhalt ersetzt mit dem charCode

content: '»' 
/* OR USE THIS */ 
content: '»' 

Answer 3

Warum ist Â wird ihm hinzugefügt?

Da Ihr Stylesheet als UTF-8 gespeichert ist, aber der Browser es mit Windows-1252 dekodiert. Dies liegt wahrscheinlich daran, dass die Seite, die auf das Stylesheet verweist, keine deklarierte Kodierung hat und der Browser willkürlich Windows-1252 erraten würde, was normalerweise die Standardkodierung für westeuropäische Ländereinstellungen ist. Die Bytefolge 0xC2 0xBB repräsentiert » in UTF-8 aber » in Windows-1252.

Das Hinzufügen der <meta charset> Deklaration in Akjms Antwort auf die Seite (n), die auf das Stylesheet verweisen, sollte dies funktionieren. Wenn Sie dies nicht tun können (zum Beispiel, weil Sie ein Stylesheet machen, die von anderen Menschen die Seiten verwiesen werden könnten, die in irgendeiner Codierung sein könnte), Alternativen sind:

1. Codierung des Zeichen CSS Backslash-Fluchten mit wie in @ RobFonsecas Antwort. (Die HTML-Zeichenreferenz Syntax in @ Antwort Akjm das ist hier nicht wirksam.)

2. die Regel @charset "utf-8"; an der Spitze des Sheet setzen Sie den Browser zu sagen, dass das Stylesheet seine eigene Codierung hat, unabhängig von was auch immer der Seite verwendet

3. Einstellung der Web-Server das Stylesheet mit einem HTTP-Header Content-Type: text/css;charset=utf-8

Unterstützung zu dienen Ansätze 2-4 traditionell steinig war, obwohl ich nicht Browser-Unterstützung vor kurzem überprüft haben.