为什么'font-family'不会自动在'<button>'标签中继承？

Question

我注意到在<button>标签的情况下,font-family不会自动继承; 或者我必须明确指定它:

<button style="font-family: some_style;">Button</button> 

或者像这样使用inherit属性:

<button style="font-family: inherit;">Button</button> 

但是,如果是其他标记(例如标记),则会自动继承font-family<a>.

为什么<button>标签有这个问题？

这是一个演示.

Answer 1

表单元素不继承字体设置,您必须手动设置此属性.

如果您使用字体声明,例如.身体,

body {font-family: arial, sans-serif}

使用只是

body, input, textarea, button {font-family: arial, sans-serif}

要么

input, textarea, button {font-family: inherit}

Answer 2

如果您使用其开发人员工具在浏览器中检查演示，您可以看到button元素的字体系列来自浏览器样式表。它们以不同的方式显示这一点，并且它们可能在那里使用不同的字体，但原理是相同的：font-family在某些样式表中对元素的属性进行了声明，因此该属性不能被继承（除非您明确设置该值inherit当然，在它上面）。

这在规范中没有定义，但它们也没有禁止这样的浏览器样式表设置，它们是常见的做法。