Question

如果从CSS中获得以下代码：

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

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

我面临的问题是尝试在@ font-face上使用非网页安全排版。我使用的字体有一个特定的粗体字体。在Chrome等中，以下内容无效：

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

因为如果使用SpecialBold类型，特殊字体只能是粗体。

如何使Firefox不会加粗已加粗字体？或者反之亦然，我是否可以使用Chrome等在使用font-weight:bold时使用粗体字样？

Answer 1

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

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

当然，可能需要根据您的字体调用的具体内容进行修改。

Answer 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);
}

因此，您可以使用相同的font-family名称并使用font-weight更改权重，而不是使用两个不同的字体名称。请确保在您的网站上添加字体的网址，以防用户没有！

Firefox font-weight与font-family属性;如何避免双重加粗

2 个答案: