在 body 元素上指定的字体大小被输入忽略答案

【问题标题】：font-size specified on body element is ignored by input在 body 元素上指定的字体大小被输入忽略
【发布时间】：2010-12-12 02:16:24
【问题描述】：

我这里有一个基本网页http://www.webdevout.net/test?0V，转载如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
 <style type="text/css">
 body { font-size: 12px;}
 </style>
 <title>Test</title>
</head>
<body>
 <p>test</p>
 <form action="/foo" method="get">
  <fieldset>
   <input type="text" value="bar" />
  </fieldset>
 </form>
</body>
</html>

当我使用 firebug 检查页面时，文本“test”是预期的 12px，但输入中的文本“bar”是 11px，我希望它是 12px。请问这是怎么回事？

【问题讨论】：

一些附加信息komodomedia.com/blog/2006/10/css-trickery-part-5-inheritance

标签： css input font-size

【解决方案1】：

在您使用的浏览器中，font-size 属性的默认值不是inhert 或百分比、em 或其他相对长度值。即它是一个绝对值。

自己设置 font-size 属性，例如input { font-size: 100%; }

考虑使用reset stylesheet。

【讨论】：

感谢大卫的回复，但 CSS 继承并没有声明输入将采用其父级的样式，而后者将依次继承其父级，最终到达元素，其中字体大小指定为 12px。有趣的是，这个问题来自使用 Eric Meyers 重置样式表。
@pingu — 仅当 font-size 属性的值设置为 inherit 时，它不是。
@David — 支持font-size: 100% 比支持font-size: inherit 要好。
@David - 在这种情况下，不会输入 { font-size: 100%; } 是重置样式表的好人选吗？怎么没有一个包含这个？
@pingu - 你得问问他们的作者。

【解决方案2】：

一些浏览器根据其相应的操作系统用户界面元素来设置表单元素的样式。因此，它们可能不会尊重您在 body 上应用的所有样式（即它们可能不会继承自它）。

您需要选择这些特定元素然后应用规则。

body, input {
    font-size: 12px;
}

【讨论】：

感谢 BoltClock，我在管理特异性的规则中没有看到任何提及这一点，它只是输入吗？还是选择？
我认为的输入、选择、按钮和文本区域。

【解决方案3】：

试试

* {
    font-size:12px;
}

【讨论】：

这解决了它，但它有点像大锤，我不应该这样做吗？
好吧，既然所有可见元素都进入正文，除了它也适用于输入之外，它实际上并没有什么不同。