html - 最佳做法-@ font-face正常/粗体/沉重

考虑到@ font-face命令通过CSS将自定义字体添加到网页时，我遇到了一个问题。

我一直这样使用@ font-face：

@font-face {
    font-family: "MyFont";
    src: url('url-to-font') [eot, woff, ttf, ...];
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "MyFont-Bold", [Fallbacks...];
    src: url('url-to-font') [eot, woff, ttf, ...];
    font-weight: bold;
    font-style: normal;
}

* {
    font-family: "MyFont", [Fallbacks...]
}

h1 {
    font-family: "MyFont-Bold", [Fallbacks...];
}

有两件事：使用通配符选择器（*）在整个页面上应用字体是可以的吗？有更好的方法吗？

是否可以省略：

font-family: "MyFont-Bold";

而是说：

font-family: "MyFont";
font-weight: bold;

如果是的话，这样做有什么好处吗？

非常感谢你！

最佳答案

您通常会这样做：

@font-face {
    font-family: "MyFont";
    src: url('font-regular.woff'); /* note filename */
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "MyFont";
    src: url('font-bold.woff'); /* note different filename */
    font-weight: 700;
    font-style: normal;
}

h1 {
    font-family: "MyFont", [Fallbacks...];
    font-weight: 700; /* automatically picks the bold flavour now */
}

关于html - 最佳做法-@ font-face正常/粗体/沉重，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30265136/