Question

我正在使用css @ font-face函数来定义自定义字体。该字体被称为'Myriad Pro Bold'，作为后备，我使用Arial / Sans-Serif。

@font-face { font-family: MyriadProBold; src: url('fonts/myriadpro_bold.otf'); }
h3 { font-family: MyriadProBold, Arial, Sans-Serif; }

只有在显示Arial或其他Sans-Serif字体时才需要 font-weight：bold; 元素。如果我将 font-weight：bold; 添加到标记并加载MyriadProBold，则粗体字体变得格外粗体，看起来很难看。

所以实际上我正在寻找类似这样的东西

if h3 font is MyriadProBold
  font-weight: normal;
else
  font-weight: bold;

感谢帮助，谢谢！

Answer 1

Myriad Pro Bold是Myriad Pro系列的大胆字体，应该这样声明：

@font-face {
    font-family: "Myriad Pro";
    src: url('fonts/myriadpro_bold.otf');
    font-weight: bold;
}

然后你可以简单地让h3具有默认的粗体，或者如果有一些“CSS重置”或其他扰乱它的代码则明确声明：

h3 { font-weight: bold; }

现在您只需以自然的方式声明字体系列：

h3 { font-family: "Myriad Pro", Arial, sans-serif; }

Answer 2

您的后备字体与自定义字体的重量不匹配。但是，arial有大胆的变化。你可以试试
h3 { font-family：custom，'Arial Bold'，sans-serif; }

Answer 3

您是否尝试在@ font-face中设置font-weight？

@font-face {
    font-family: "MyriadProBold";
    src: url('fonts/myriadpro_bold.otf');
    font-weight: normal;
}
h3 {
    font-family: MyriadProBold, Arial, Sans-Serif;
    font-weight: bold;
}

不确定它是否有效但试一试。

如果@ font-face不起作用，则以粗体显示文本

3 个答案: