CSSコンテンツの値にUnicode文字を配置する

Question

問題があります。 ↓（↓）

クールダウンコードのHTMLコードが見つかりました。 ↓は、HTMLのシンボルであるので、明らかに動作しません

nav a:hover {content:"&darr";} 

：今、私はそうのようにCSSでそれを使用する必要があります。 cssで使用されるこれらの "エスケープされたユニコード"シンボルについての情報は少ないようです。 \2020のようなシンボルがありますが、矢印はありません。矢印コードは何ですか？

Answer 1

CSSファイルをUTF-8として保存/配信しないのはなぜですか？

nav a:hover:after { 
    content: "↓"; 
} 

それが十分ではない、とあなたはそれをすべて-ASCIIを保持する場合：

nav a:hover:after { 
    content: "\2193"; 
} 

文字列内のUnicode文字のための一般的な形式は\FFFFFFに\000000ある - 6バックスラッシュに続きます16進数です。 Unicode文字が文字列の最後の文字である場合、またはUnicode文字の後にスペースを追加する場合は、先頭の0桁を省略することができます。詳細については、以下の仕様を参照してください。

---

Relevant part of the CSS2 spec：

第三に、バックスラッシュエスケープは、著者は、彼らが簡単に文書に置くことができない文字を参照することができます。この場合、バックスラッシュの後には、最大で6桁の16進数（0..9A..F）が続きます。これは、その番号のISO 10646（[ISO10646]）文字を意味し、ゼロであってはなりません。 （スタイルシートがにUnicodeコードポイントゼロの文字を含む場合、CSS 2.1では定義されていません）。[0-9a-fA-F]の範囲の文字が16進数の後に続く場合は、明確にする必要があります。それを行うには2つの方法があります。スペース（または他の空白文字）で

1. ： "\ 26 B"（ "& B"）。この場合、ユーザエージェントは "CR/LF"の対（U + 000D/U + 000A）を単一の空白文字として扱うべきです。正確に6桁の16進数を提供することによって、
2. ： "\ 000026B"（ "& B"）は

実際には、これらの2つの方法を組み合わせてもよいです。 16進エスケープの後には空白文字は1つだけ無視されます。これは、エスケープシーケンス後の "実"スペースを2倍にする必要があることに注意してください。

数値がUnicodeで許可されている範囲外の場合（たとえば、現在のUnicodeで「\ 110000」が最大10FFFFを超えている場合）、UAはエスケープを「置換文字」（U + FFFD）に置き換えます。文字が表示される場合、UAは、「欠けている文字」グリフ（15.2,ポイント5参照）などの可視シンボルを表示する必要があります。

• 注：バックスラッシュエスケープは常にidentifierまたは文字列の一部であると考えられている（つまり、「\ 7Bは、」「{」であり、「\ 32」は、開始時に許可されているにもかかわらず、句読点ではありません「2」ではないにもかかわらず、クラス名の）。
  識別子 "te \ st"は "test"とまったく同じ識別子です。

---

包括的なリスト：Unicode Character 'DOWNWARDS ARROW' (U+2193)。