在做了一些研究和谷歌搜索后,我找不到一个明确的答案,所以我想在这里问.
哪里最好添加font-family？到html或body元素？
编辑 我的道歉,有些人认为我的意思是内联,这不是我的意思.
让我们这样做,这是最好/首选的方式:或
html{
font-family: sans-serif;
}
要么
body{
font-family: sans-serif;
}
问候,
Kal*_*Kal 26
简短的回答是，您可以使用其中任何一个。由于每个显示的元素都是该元素的后代body，并且该body元素本身是该元素的子元素html，因此继承该属性的所有元素font-family都会很乐意从其中一个元素采用它。（如果特定元素未继承它，您始终可以font-family使用值覆盖其属性inherit。）
但什么是最佳实践，为什么？这个问题有点难回答，但我会尝试一下。让我们从语义开始\xe2\x80\xa6
\n元素代表整个文档（包括不可见的元数据），而元素代表html文档的内容。由于是样式化内容的属性，因此将其应用到 似乎是合乎逻辑的。这是一分。bodyfont-familybodybody
下一个问题：浏览器在哪里定义文本格式属性，例如font-family？我查看了Safari (WebKit)、Mozilla Firefox和Chrome的用户代理样式表，还在没有覆盖 CSS 的页面上使用了 Web Inspector，但我在任何地方都找不到全局声明font-family。但这里有一些有趣的东西\xe2\x80\xa6 在 Safari 中，全局文本color属性是在html元素上定义的。因此，如果这可以作为参考，那么它表明 WebKit 浏览器确实在html元素上定义了全局字体属性。
CSS 重置也可以在这里解决这个问题，例如 Bootstrap_reboot.scss文件：
// 2. Change the default font family in all browsers.\nhtml {\n font-family: sans-serif; // 2\n \xe2\x80\xa6\n}\n不过，我们可以在body元素上重写它，这正是 Bootstrap 在几行之后所做的事情：
body {\n margin: 0; // 1\n font-family: $font-family-base;\n \xe2\x80\xa6\n}\n半点到html？
CSS 规范（据我所知）并没有规定font-family声明的位置（它适用于“所有元素”），但它确实给了我们一些提示。W3C 文档CSS Fonts Module Level 3中的第一个代码示例是这样的：
body {\n font-family: Helvetica;\n font-weight: bold;\n}\n另一篇在这里：
\nbody {\n font-family: "Gill Sans", sans-serif;\n font-size: 12pt;\n margin: 3em;\n}\n它解释说：
\n\n\nBODY 元素上的第一个声明将字体系列设置为“Gill Sans”。如果该字体不可用，用户代理（通常称为“浏览器”）将使用sans-serif字体系列，它是所有用户代理都知道的五个通用字体系列之一。BODY 的子元素将继承font-family属性的值。
\n
另一点是body。
最终成绩：
\nbody: 2
\n html: 0.5
获胜者：body！:-D
最佳做法是font-family在body.
body {
font-family: Arial !important;
}
在!important这里很有用，因此如果您使用任何其他框架，font-family则不会被覆盖。
您也可以使用*选择器。
* {
font-family: Arial !important;
}
该*-selector指任何/所有的元素，但显然是在产业链的底部，当谈到覆盖更具体的选择。
请注意，即使其他选择器已用于设置文本（例如， the或 a ），该!important标志也会将字体样式呈现为*绝对的。bodyp
小智 5
选择*器将为您提供更好的覆盖范围。例如，form元素（如input）不会从html和body标签继承字体样式。但如果您设置它，*那么您将确保您的字体样式传递到所有 HTML 元素。
* {
font-family: 'Open Sans', Helvetica, sans-serif;
}
这是一个演示。使用* 选择器与html 和 body。