CSS内容特殊字符:十六进制与普通字符

时间:2013-03-27 10:53:33

标签: css css3 hex character glyph

示例'BLACK STAR'★(U + 2605)

.a:after {
   content: "\2605";
   position:absolute;
}

.b:after {
   content: "★";
   position:absolute;
}

演示: http://jsfiddle.net/l2aelba/vBjxX/

为什么某人/大多数人建议在CSS值中使用 HEX ,例如\2605?两者都得到相同的结果。

2 个答案:

答案 0 :(得分:5)

最好使用实际值而不是硬编码特殊字符(如底部示例),因为由于CSS文件本身的编码,它们可能无法正确显示。

答案 1 :(得分:2)

你不需要记住荒谬的键盘快捷键来添加一个unicode号码。

请记住,此十六进制数字表示unicode中的独特标准字符。 插入实际字符会使您受到字符集的支配,实际上是用于显示css的字体。

更重要的是,许多图标字体Font Awesome都是一个很好的例子,它被映射为使用Unicode的私有使用区域之一。 Font Awesome字符位于第一个私人使用区域内。

根据标准中的定义,私人使用区域内没有标准化字符。这意味着没有要显示的字符,因此样式表中唯一有形的表示是对它在unicode中的位置的数字引用。

为什么这些图标映射到目前为止?一个重要原因是某些屏幕阅读器会读出css内容中使用的任何字符。这似乎是错误的,但确实发生了,需要进行防范。不会读出私人使用区域字符。

就个人而言,我的方法是按原样使用键盘字符,并将unicode数字用于其他所有内容。即便如此,如果中国人想要使用我的代码,我是否知道他们可以轻松访问自己键盘上的所有相同字符?他们会有数字。