不使用font-weight引用粗体版：粗体？

Question

我在网站上使用webfonts。对于某些标题（h1，h2等）我正在使用粗体变体（并将font-weight设置为正常），因为它们看起来比使用常规变体并离开h更好-tags使用默认的粗体重量。有必要指定font-weight: normal，否则“粗体加粗”，看起来非常糟糕。

我遇到的问题是，如何将标准网络字体指定为后备字体并将粗体设置为“已恢复”？

例如，我可能会这样做：

@font-face {
    font-family: "My bold webfont";
    src: url("url/of/webfont/bold/variant");
}

h1 {
    font-family: "My bold webfont", Arial, sans-serif;
    font-weight: normal; 
}

只要webfont存在我们没有问题，但如果webfont失败，我们最终会得到非粗体Arial。

有没有办法在font-family h1中指定“Arial Bold”（我知道这不起作用，但这是预期的目标）？或者也许在@font-face定义中，我可以说“这仅适用于分配给它的任何内容的粗体版本” - 所以我可以省略font-weight: normal样式中的h1？

Answer 1

尝试在两个地方指定font-weight: bold：

@font-face {
    font-family: "My bold webfont";
    src: url("url/of/webfont/bold/variant");
    font-weight: bold;
}

h1 {
    font-family: "My bold webfont", Arial, sans-serif;
    font-weight: bold;
}

Here's a demo. p#one显示正在使用此技术;如果你在不支持WOFF webfonts的浏览器中查看它，你会看到粗体的默认字体。