AngularJS：自定义字体图标答案

【问题标题】：AngularJS: Custom font iconsAngularJS：自定义字体图标
【发布时间】：2015-05-10 21:32:32
【问题描述】：

由于字体比图像更能在不同设备上显示图标，我想在我的 AngularJS 项目中制作我的自定义字体图标库，例如“Font Awesome”。

我用我的图标在 .ttf 和 .svg 中创建了一个字体，结果很好，但是任何图标都有一个相关的字母。例如，主页图标是新字体中的字母“H”。

此方法在 Firefox 中存在小问题。在 Firefox 中，在图标变为主页图标之前，您可以看到字母“H”。

谢谢。

【问题讨论】：

【解决方案1】：

预加载字体。 FF 使用后备字体，直到请求的字体可用。

为什么 FontAwesome 不会发生这种情况？

<i class="fa fa-something"></i>

生成文本并且只为生成的文本指定一个面，即使它包含在具有指定后备列表的样式的元素中。

我建议你看一下 FA 附带的 CSS。

【讨论】：

【解决方案2】：

您应该尝试使用Font Custom 之类的工具从您的 svg 图标开始生成您的自定义图标网络字体。 FontCustom 会生成css和字体文件，还有很多options可以配置。

【讨论】：