css - 将后备字体添加到@ font-face定义

Question

是否可以将后备字体直接添加到font-face的定义中？

例子:

@font-face {
  font-family: 'MyWebFont', Arial, Helvetica, sans-serif;
  src: url('fonts/MyWebFont.eot');
  src: url('fonts/MyWebFont.eot?#iefix') format('embedded-opentype'),
  url('fonts/MyWebFont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

然后将其用作具有自动回退的font-family值，如下所示:

p {
  font-family: MyWebFont;
}

我的目标是不必在定义新字体系列的每个地方都定义后备字体。如果不像上面那样，我可以在没有JavaScript的情况下以某种方式实现这一目标吗？谢谢你的帮助!

Answer 1

不可以，您不能在 @font-face 规则中指定任何后备字体，因为这样的规则定义了一个字体并为其指定了名称。在规则内部，font-family部分只能包含一个名称，即您选择分配的名称。在那里列出几个名称将是毫无意义的，因为只有第一个名称可能很重要(此外，在这种情况下，任何名称都没有任何预定义的含义，例如Arial并不意味着Arial字体，而只是一个任意分配的名称)。

后备字体只能在常规font-family规则中指定。

考虑组织样式表，以便使用合适的选择器列表，使相关的font-family列表仅出现一次，例如

p, blockquote, .foobar, .something {
   font-family: MyWebFont, Arial, Helvetica, sans-serif;
}