例「BLACKSTAR」★(U + 2605)
.a:after {
content: "\2605";
position:absolute;
}
.b:after {
content: "★";
position:absolute;
}
デモ: http: //jsfiddle.net/l2aelba/vBjxX/
なぜ誰か/ CSS値のようにHEXを使用することを最もお勧めしますか?\2605
どちらも同じ結果になります。
例「BLACKSTAR」★(U + 2605)
.a:after {
content: "\2605";
position:absolute;
}
.b:after {
content: "★";
position:absolute;
}
デモ: http: //jsfiddle.net/l2aelba/vBjxX/
なぜ誰か/ CSS値のようにHEXを使用することを最もお勧めしますか?\2605
どちらも同じ結果になります。
CSSファイル自体のエンコードが原因で正しく表示されない可能性があるため、下の例のように特殊文字をハードコーディングするのではなく、実際の値を使用することをお勧めします。
たとえば、Unicode番号を追加するために、ばかげたキーボードショートカットを覚えておく必要はありません。
この16進数は、Unicodeで明確に標準化された文字を表すことを忘れないでください。実際の文字を挿入すると、cssの表示に使用されている文字セット、そして実際にはフォントに翻弄されます。
さらに重要なことに、多くのアイコンフォント(Font Awesomeが良い例です)は、Unicodeの私用面の1つを使用するようにマップされています。FontAwesomeのキャラクターは最初の私用エリア内にあります。
標準での定義により、私用面内に標準化された文字はありません。これは、表示する文字がないことを意味します。したがって、スタイルシートの具体的な表現は、Unicode内のその場所への数値参照のみです。
これらのアイコンがこれまでにマッピングされているのはなぜですか?大きな理由は、一部のスクリーンリーダーがcssコンテンツで使用されている文字を読み上げることです。これは間違っているように見えるかもしれませんが、実際に発生するため、防御する必要があります。私用面の文字は読み上げられません。
個人的には、キーボードの文字をそのまま使用し、それ以外はユニコード番号を使用するというアプローチです。それでも、中国人が私のコードを使用したい場合、彼らが自分のキーボードで同じ文字すべてに簡単にアクセスできることを知っていますか?しかし、彼らには数字があります。