疑似要素のcontentプロパティに特殊文字を指定する際の注意点
「要素名::before」や「要素名::after」などの疑似要素の content プロパティに 特殊文字を指定したい場合は、注意が必要です。通常の10進表示だと表示されません。
次のような変換が必要となります。
- 10進数を16進数に変換
- 「＆」を「\」に変換
- 「#」を「0」に変換
- 最後のセミコロン「;」は不要。
例えば、ハートマークの場合は、次のように変換します。
♥ ♥ → \02665
疑似要素の content プロパティに指定する場合は次のようになります。
要素名::before {
content: "\02665";
}
特殊文字の16進一覧はこちらのサイトに詳しく載っていますので参考にしてください。