Firefox font-weight 与 font-family 属性；如何避免双粗体字答案

【问题标题】：Firefox font-weight versus font-family property; how to avoid double-boldingFirefox font-weight 与 font-family 属性；如何避免双粗体字
【发布时间】：2012-03-05 23:15:18
【问题描述】：

如果从 CSS 中给出以下代码：

font-family:SpecialBold;
font-weight:bold;

Firefox 双粗体（它加粗已经是粗体）。这在 Safari、Opera 或 Chrome 中似乎不是问题。我不能只删除font-weight:bold;，因为如果托管字体出现问题，默认字体不会加粗。

我面临的问题是尝试在@font-face 上使用非网络安全的排版。我使用的字体具有特定的粗体字体。在 Chrome 等中，以下内容将不起作用：

font-family:Special;
font-weight:bold;

因为只有在使用 SpecialBold 字体时，Special 字体才能为粗体。

如何使 Firefox 不加粗已经粗体的字体？或者，反之亦然，我可以让 Chrome 等在使用 font-weight:bold 时使用粗体字吗？

【问题讨论】：

标签： firefox fonts font-face bold

【解决方案1】：

您可以使用此规则告诉浏览器 SpecialBold 已经是粗体，因此不需要应用合成粗体：

@font-face {
  font-family: SpecialBold;
  font-weight: bold;
  src: local(SpecialBold);
}

当然，可能需要根据您的字体名称进行修改。

【讨论】：

今晚/明天试试这个。感谢您的帮助。会投票给你，但仍然有一个新帐户。

【解决方案2】：

@font-face {
    font-family: Special;
    font-style:normal;
    font-weight: normal;
    src: local(Special);
}   
@font-face {
    font-family: Special;
    font-weight: bold;
   font-style:normal;
    src: local(SpecialBold);
}

因此您可以使用相同的字体系列名称并使用字体粗细来更改粗细，而不是使用两个不同的字体名称。请务必在您的网站上添加字体的 URL，以防您的用户没有它！

【讨论】：