HTML/CSS 通过 unicode + CSS 中的类使用 ttf 字体

Posted 2023-02-19

【中文标题】HTML/CSS 通过 unicode + CSS 中的类使用 ttf 字体

【英文标题】：HTML/CSS Using ttf fonts via unicode + classes in CSS

【发布时间】：2016-05-25 09:35:17

【问题描述】：

我在尝试通过 CSS 中的类使用我的 .ttf 字体时遇到了一些麻烦。问题是什么都没有显示。我已经加载了 .ttf 字体文件并从 .ttf 字体文件中为这个特定的图标创建了一个 CSS 类。关于这个特定图标，我所拥有的所有可用信息都是这样的：

字形：5 字符# : 97 统一码：0061 一个

@font-face 
font-family: 'remoglyph';
    src:url('../RemoGlyphs.ttf');
    font-weight: normal;
    font-style: normal;


[class^="icon-"]:before,
[class*=" icon-"]:before 
    font-family: 'remoglyph';
    font-style: normal;
    speak: none;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
            font-smoothing: antialiased;
    text-rendering: optimizeLegibility;


.icon-arrowdown:before 
    content: "\e0061";

<i class="icon-arrowdown"></i>

你可以在上面看到我的 CSS 和 html 源代码。

提前感谢您的任何建议。

【参考方案1】：

愚蠢的错误，对不起各位..

content: "\0061"

还是谢谢:)

【讨论】：

为了确保真正的跨浏览器，您应该使用不同的字体格式...例如，您可以使用此在线转换工具 (fontsquirrel.com/tools/webfont-generator) 并遵循其 css 规则来加载它们全部。