CSSのcontentプロパティの文字化けについて

CSSのcontentプロパティというのがありますね。
これは便利。
知らない人のために少しだけ。
contentプロパティとは、HTMLソースに記述されていない内容（文字もOK）をcssを使用して付加することができるプロパティのことです。
例えば、リスト<li></li>の中の要素の先頭に「☆」を入れたいというときなどにこのプロパティを使用します。

【html】

 
<ul> 
	<li>佐藤さん</li>
	<li>鈴木さん</li>
	<li>高橋さん</li>
</ul>

【css】

ul li:before { 
	content: "☆";
}

こう書くわけですね。
これで首尾よく以下のように表示されるはずです。

☆佐藤さん
☆鈴木さん
☆高橋さん

しかし…！
文字コードやなんやのおかげ様で文字化けを起こしてしまうことがあります。

?佐藤さん
?鈴木さん
?高橋さん

↑こんなん(´д`)

やっぱし2バイト文字は数値文字参照の値で書いた方がいいかと思います。
数値文字参照は16進数で記述します。

例えば☆を数値文字参照変換すると「&#x2606;」という値になりますが、contentプロパティで利用する場合は、そのまま書いても☆にはなりません。

&を\に変更し、#とxを0に変更してさらにセミコロンを消す必要があります。

(‘A`)ﾏﾝﾄﾞｸｾ・・・

↓そんな時はｺﾚｰ（・∀・）

【16進数値文字参照 変換表】

【css】

ul li:before { 
	content: "\02606";
}

これで完璧に以下のように表示されるはずです。

☆佐藤さん
☆鈴木さん
☆高橋さん