我注意到,如果是<button>
个标签,则 font-family 不会自动继承;或者我必须明确指定它:
<button style="font-family: some_style;">Button</button>
或使用继承属性,如下所示:
<button style="font-family: inherit;">Button</button>
但是,对于其他标记,例如<a>
标记, font-family 会自动继承。
为什么<button>
代码存在此问题?
这是 DEMO 。
答案 0 :(得分:15)
表单元素不继承字体设置,您必须手动设置这些属性。
如果您使用字体声明,例如。身体,
body {font-family: arial, sans-serif}
仅使用
body, input, textarea {font-family: arial, sans-serif}
或
input, textarea {font-family: inherit}
答案 1 :(得分:2)
如果您使用其开发者工具在浏览器中检查您的演示,您可以看到button
元素的字体系列来自浏览器样式表。它们以不同的方式显示它们,并且它们可能在那里使用不同的字体,但原理是相同的:在某些样式表中有元素的font-family
属性的声明,因此该属性不能被继承(除非你在其上明确设置值inherit
)。
这在规范中没有定义,但它们都不禁止这样的浏览器样式表设置,并且它们是常见的做法。
答案 2 :(得分:2)
我知道这是一个老问题,我迟到了。 @panther和@ jukka-k-korpela都正确回答了这个问题。但是,他们缺少有关@ nikunj-madhogaria提供的精确问题解决方案和演示的重要信息。我试图根据问题来回答。
由于问题是关于button
标记的,因此将button
添加到@panther提供的CSS修订可能是明智的。因此,这是按钮标签的正确解决方法:
button { font-family: inherit }
答案 3 :(得分:-1)
旧回复,但它可能对某些人有所帮助。我添加了以下内容:
* {
font-family: arial, sans-serif
}