css 规则 font-family 是否会覆盖所有继承的字体或只是添加更多选项？

Question

我有这个问题：

body{
  font-family: 'MyFontFace-font', 'Lucida Grande', Tahoma, Verdana, Arial, etc.
}

H1 {
 font-family: 'MyFontFace-font2'
}

我的问题是：如果没有加载第二个字体 ('MyFontFace-font2')，H1 的字体是从 body 继承的，还是从浏览器的默认值继承的？

非常感谢。

Answer 1

将应用浏览器的默认后备字体，并body忽略任何设置。

当您将值赋给元素的属性，如font-family到h1这里，然后继承永远不会适用于该属性，元素（除了平凡，如果分配的值inherit和浏览器支持一些）。这不会被随意的事情改变，比如指定不存在的字体的值。

我还使用以下更简单的文档对此进行了测试（在没有命名字体MyFontFace-font2但有一个名为的字体的系统上Tahoma）：

<!doctype html>
<title>Test5</title>
<style>
body{
  font-family: Tahoma;
}
H1 {
  font-family: 'MyFontFace-font2'
}
</style>
<h1>Hello world</h1>

在 Chrome、Firefox、IE 中，结果是使用浏览器的默认字体，而不是 Tahoma。这是规范的预期结果。

如果该规则H1被忽略，那么宋体时，由于继承-那么该h1元素将继承font-family从其父财产。