»の代わりに»を印刷するのはなぜですか？

Question

これを表示するには、»ですが、代わりに»が表示されています。 Âはなぜそれに追加されていますか？どのように二重右矢印だけではないのですか？私のコードに何が問題なのですか？

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> 

画像：

Answer 1

とコンテンツの属性にCSSを文字に置き換えてみてください、そして、

<meta charset="utf-8"> 

：

まず最初の最初の、あなたの頭のタグに、あなたがこのような何かを持っていることを確認してくださいコンテンツプロパティでUnicode 16進エスケープを使用する必要があります

content: '\00bb', 

ここで私はそれら https://css-tricks.com/snippets/html/glyphs/

Answer 2

それは、文字のレンダリングでレンダリングエラーの可能性があります。 CHARCODE

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

Answer 3

の便利なチャートはなぜÂは、それに追加されているsの？

スタイルシートはUTF-8として保存されますが、ブラウザはWindows-1252を使用してデコードしているためです。これはおそらく、スタイルシートを参照しているページには宣言されたエンコーディングがなく、ブラウザはWindows-1252を任意に推測しているためです.Windowsのロケールのデフォルトのエンコーディングです。 0xC2 0xBBのバイトシーケンスは、UTF-8では»、Windows-1252では»を表します。

スタイルシートを参照するページに対するAkjmの答えに<meta charset>宣言を追加すると、この作業が可能になります。 （あなたが任意のエンコーディングに含まれている可能性が他の人のページによって参照される可能性がありますスタイルシートを作っているので、たとえば）あなたがこれを行うことができない場合は、選択肢は以下のとおりです。

1. CSSのバックスラッシュ・エスケープを使用して文字を符号化します@ RobFonsecaの答えのように。 （@ Akjmの答えでHTMLの文字参照の構文は、ここでは効果的ではありません。）

2. ページは

   を使用するものは何でもとは独立して、スタイルシートは、独自のエンコーディングを持つブラウザを伝えるために、スタイルシートの最上部にルール@charset "utf-8";を置きます私は最近、ブラウザのサポートをチェックしていないのにアプローチ2-4

3. HTTPヘッダーContent-Type: text/css;charset=utf-8

でスタイルシートを提供するために、Webサーバの設定のサポートは、伝統的に、岩場となっています。