在CSS内容值中放置Unicode字符

Placing Unicode character in CSS content value

本问题已经有最佳答案,请猛点这里访问。

我有问题。我找到了向下箭头的HTML代码,(↓)

酷。现在我需要在CSS中使用它,就像这样:

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

这显然行不通,因为是一个HTML符号。关于CSS中使用的这些"转义Unicode"符号的信息似乎更少。还有其他的符号,如\2020,我发现了,但没有箭头。箭头代码是什么?


为什么不将CSS文件保存/服务为utf-8?

1
2
3
nav a:hover:after {
    content:"↓";
}

如果这还不够好,而且你想保留所有的ASCII码:

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

字符串中Unicode字符的一般格式是\000000\FFFFFF–一个反斜杠,后跟六个十六进制数字。当unicode字符是字符串中的最后一个字符或在unicode字符后添加空格时,可以省略前导的0数字。详细信息请参见下面的规范。

CSS2规范的相关部分:

Third, backslash escapes allow authors to refer to characters they cannot easily put in a document. In this case, the backslash is followed by at most six hexadecimal digits (0..9A..F), which stand for the ISO 10646 ([ISO10646]) character with that number, which must not be zero. (It is undefined in CSS 2.1 what happens if a style sheet does contain a character with Unicode codepoint zero.) If a character in the range [0-9a-fA-F] follows the hexadecimal number, the end of the number needs to be made clear. There are two ways to do that:

  • with a space (or other white space character):"\26 B" ("&B"). In this case, user agents should treat a"CR/LF" pair (U+000D/U+000A) as a single white space character.
  • by providing exactly 6 hexadecimal digits:"\000026B" ("&B")
  • In fact, these two methods may be combined. Only one white space character is ignored after a hexadecimal escape. Note that this means that a"real" space after the escape sequence must be doubled.

    If the number is outside the range allowed by Unicode (e.g.,"\110000" is above the maximum 10FFFF allowed in current Unicode), the UA may replace the escape with the"replacement character" (U+FFFD). If the character is to be displayed, the UA should show a visible symbol, such as a"missing character" glyph (cf. 15.2, point 5).

    • Note: Backslash escapes are always considered to be part of an identifier or a string (i.e.,"\7B" is not punctuation, even though"{" is, and"\32" is allowed at the start of a class name, even though"2" is not).
      The identifier"te\st" is exactly the same identifier as"test".

    综合列表:Unicode字符"向下箭头"(U+2193)。