三鷹市・武蔵野市(吉祥寺)のホームページ制作会社です。三鷹市・武蔵野市(吉祥寺)のホームページ制作なら私たちにお任せください。

BLOG

beforeやafter疑似要素のcontentプロパティの文字化け回避方法

beforeやafter疑似要素のcontentプロパティで日本語などが文字化けする場合があります。

原因は、CSSファイルの文字コードがShift_JIS以外であること、または対象の疑似要素が含まれるCSSが外部ファイルであることが原因のようです。

回避方法としては、contentプロパティに日本語をそのまま入力するのではなく、Unicodeに変換した値を入力することで回避できます。

content: "★";
ではなく、
content: "\2605";
とします。