如何为后备字体设置不同的字体权重?

时间:2014-03-03 16:48:49

标签: css fonts

我遇到了我用于网站的自定义字体问题。

所以我使用以下CSS来处理文本。

font-family: "Open Sans",Helvetica,Arial;
font-weight:600;

由于网站是用我的母语构建的,我必须使用UTF-8符号,这些符号似乎不包含在Open Sans中,因此它们会在Helvetica中显示,但问题是它们有更多重量。

如果正在使用后备字体,是否有任何可能的解决方案将font-weight参数设置为normal?

2 个答案:

答案 0 :(得分:14)

您可以为所需的每种字体定义新的@font-face

@font-face {
      font-family: 'mainFont';
      src: url(/*Link to Open Sans*/);
      font-weight: 600;
}

@font-face {
      font-family: 'secondaryFont';
      src: local('Helvetica');
      font-weight: 400;
}

@font-face {
      font-family: 'tertiaryFont';
      src: local('Arial');
      font-weight: 600;
}

然后你最终得到的font-family: 'mainFont', 'secondaryFont', 'tertiaryFont';会得到理想的结果。

答案 1 :(得分:0)

不幸的是,单独使用CSS无法定义回退字体特定样式。

因此你可能想要尝试计算出正在使用的字体,然后应用一个样式see here for one method,它可以解决在“最佳猜测”之前将字体应用于元素所产生的宽度。它是。

那就是说,它本质上是一种黑客攻击/解决方法。

否则,你可以考虑实现一个方法来识别符号的位置,然后将它们包装在样式span标签中,再次这将是一个相当肮脏的黑客,而不是一个干净的解决方案。