@ font-face自定义图标字体仅显示unicodes

Question

我正在使用CSS3的@ font-face使用自定义图标字体,而在较早版本的Google Chrome中,只有unicodes显示并且没有替换或呈现在我的自定义字体中,后者显示这些unicodes的字形.

这是我正在使用的@ font-face语法:

@font-face{
    font-family:'glyphs';
    src:url('../fonts/glyphs.eot');
    src:url('../fonts/glyphs.eot?#iefix') format('embedded-opentype'),
        url('../fonts/glyphs.svg#glyphs') format('svg'),
        url('../fonts/glyphs.woff') format('woff'),
        url('../fonts/glyphs.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

知道为什么显示unicodes而不是图标字体的一部分符号？

Answer 1

你可能遇到了unicode-range限制.如此处所述,您可以在font-face声明中定义涵盖哪些Unicode字符.很可能旧的Chrome版本默认只替换拉丁字符.您应该可以通过将其添加到font-face声明来解决此问题:

unicode-range: U+00-FFFF;

话虽如此,很可能你只是遇到了一个本地问题.检查Chrome设置,在" 高级设置"下的" 网页内容"下,单击" 自定义字体",然后在底部检查" 编码"的当前设置.将其值更改为"Unicode(UTF-8)"也可以解决此问题.