如何在字体定义中为后备字体添加font-weight属性？ [英] How to add font-weight property inside a font definition for the fallback font?

问题描述

在我们的项目中，我们使用 Fira Sans Bold 来增加文本段。作为后备，我们希望使用字体大小设置为粗体的 Lucida Sans Unicode 。

但是，我们遇到了一个问题，我们需要为 Lucida Sans Unicode 预先设置 font-weight 属性。

这是什么可能的方法？

我们尝试了@ font-face。

  @ font-face {
 font-family：'Lucida Bold'; 
 font-weight：bold; 
 src：local（'Lucida Sans Unicode'）;但是，问题是，在使用 Fira Sans Bold 时，会出现这样的问题：
} 
  

$ b 我们只依赖于font-family，不使用任何其他方式来加粗字体，如font-weight：bold，strong，b等。这对于@ font-face是不够的（我提出了问题在这里：什么可以是@ font-face无法正常工作的原因？）

感谢任何想法。

解决方案

声明font-weight / font-style等仅影响哪些文本与@ font-face规则匹配。
$ b

由于字体是粗体或非粗体，声明 font-weight：bold 不会强制它变粗体。

假设使用的文字

您的文本正常的 font-weight 时，Fira Sans Bold 这意味着你需要Lucida的大胆面孔匹配每当字体重量正常，例如：

  @ font-face {
 font-family：'MyLucidaFont'; 
 font-weight：normal; 
 src：local（'Lucida Sans Unicode Bold'）; 
} 
  

每当我的文本重量：正常并使用 font-family：MyLucidaFont，则此字体面应用

然后：

  font-family：Fira Sans Bold，MyLucidaFont
  

这是假设您无法更改Fira Sans Bold定义。如果你可以，那么最好改变它，以确保它适用于任何时候你的文本 text-weight 是粗体：

  / *如果我们更改这个，我们不需要声明Lucida * / 
 @ font-face {
 font-family：'Fira Sans'; 
 font-weight：bold; /* 这还差不多！ * / 
 src：url（'/ FiraSansBold.woff'）; 
} 
  

每当您的文本 font-weight：bold 和 font-family：Fira Sans，Lucida Sans Unicode b

请记住，Lucida Sans Unicode是一个字体系列;一组字体。

In our project we use Fira Sans Bold for thickening text segments. As a fallback we would like to use Lucida Sans Unicode with font-weight set to bold.

However, we run into a problem that we need to pre-set font-weight property for Lucida Sans Unicode.

What are possible ways to do this?

We tried @font-face.

@font-face {
  font-family: 'Lucida Bold';
  font-weight: bold;
  src: local('Lucida Sans Unicode');
}

However, the problem is, while using Fira Sans Bold we rely only on the font-family and do not use any other other ways of thickening the font, such as font-weight:bold, strong, b, etc. This is insufficient for the @font-face (I raised the question over here: What can be the reason for @font-face failing to work?)

Would be grateful for any ideas.

解决方案

Declaring font-weight/ font-style etc only affects which text 'matches' a @font-face rule.

As a font face is either bold or it isn't, declaring font-weight:bold won't force it to become bold. It'll just make it show up whenever your text is supposed to be bold.

Presumably the text that uses Fira Sans Bold is bold when font-weight of your text is normal. That means you'll want the bold face of Lucida to match whenever font-weight is normal, like this:

@font-face {
  font-family: 'MyLucidaFont';
  font-weight: normal;
  src: local('Lucida Sans Unicode Bold');
}

"Whenever my text is font-weight:normal and uses font-family:"MyLucidaFont" then this font-face is applied"

Then:

font-family:"Fira Sans Bold","MyLucidaFont"

This is assuming that you can't change your Fira Sans Bold definition. If you can, then it'd be better to change that instead to make sure it applies whenever your texts text-weight is bold:

/* We don't need to declare Lucida at all if we change this one */
@font-face {
  font-family: 'Fira Sans';
  font-weight: bold; /* That's more like it! */
  src: url('/FiraSansBold.woff');
}

Whenever your text has font-weight:bold and font-family:"Fira Sans","Lucida Sans Unicode" it'll be bolded with a fallback.

Keep in mind that "Lucida Sans Unicode" is a font family; a group of font faces.

这篇关于如何在字体定义中为后备字体添加font-weight属性？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！