CSS 图标字体的 font-family 回退？

Question

我的 IDE 检查我的 CSS 文件，如果我放置了没有通用回退的 font-family 规则就会抱怨。总的来说，不得不同意我的IDE，我会很乐意添加字体回调

示例：

.selector {
  font-family: Arial;  /* IDE complains. */
  font-family: Arial, sans-serif;  /* IDE is happy. */
}

然而，有时 font-family 是一种图标字体（我认为 fontawesome 是其中之一），而回退并没有真正意义。或者是吗？

.my-icon {
  font-family: 'my-icon-font';  /* IDE complains. */
  font-family: 'my-icon-font', serif;  /* IDE is happy, but it does not make sense. */
}

问题

是否可以有任何合理的后备方案，可以将图标字体附加到字体系列规则？

额外的动力

就我而言，主要是我的 IDE 促使我添加通用字体回调。作为最后的手段，我可​​以禁用、禁止或忽略此检查。

然而，在其他团队中可能有关于代码约定的严格规则，甚至可能有一种机制，如果不遵守就会阻止提交。

或者，如果我是代码检查工具的作者，或者正在定义项目中使用的编码约定的过程中怎么办？那么我绝对想知道什么是 "correct" 或最聪明的方法:)

Answer 1

可以加“幻想”：

.my-icon {
  font-family: 'my-icon-font', fantasy;
}

Answer 2

如评论中所述，这是虚假警告。

正如您自己指出的那样，没有适合作为图标字体后备的通用字体系列 - 也不可能有，因为图标字体没有标准化。

仅相关规范（CSS 字体模块级别 3）lists the following generic families：

• 衬线体
• 无衬线体
• 草书
• 幻想
• 等宽

其中

None 是合适的 - 因为它们都明确不适用于 icon/picture 字体。

所以你应该找到一种方法来抑制警告。理想情况下，系统将允许您添加应抑制警告的字体列表（例如图标字体）。否则，您只需完全取消警告。

---

旁注：仅当您想使用安装在用户计算机上的字体时，才真正需要后备字体 - 例如标准 Windows 字体，如 Arial。在那种情况下，您需要后备，因为您无法确定用户安装了什么。

如果您使用浏览器可以下载的网络字体，则永远不需要后备字体。在字体下载失败的情况下包含它仍然很好，但恕我直言并不那么重要。