css - 查找为什么网页中的文本比使用 Firebug 应该大

Question

我有一些文本以比预期更大的字体显示。我使用了 Firebug，它显示文本是元素 CSS 中定义的 12px。然而，Web Developer 和 CSSViewer 都报告文本是 16 像素，这是当前显示的内容。

使用所有这些工具，我无法快速确定 16px 字体大小的来源。它应该是 12 像素。

使用这些工具（或其他工具）确定如何计算 16px 的最佳方法是什么？虽然我可以通过级联层次结构找到这一点，但我想知道是否有一种方法可以更轻松地获取信息。

Answer 1

使用Web 开发者工具包时，您可以看到元素的 DOM 路径 - 只需查看较高元素之一是否具有不同的字体大小。Firebug 应该显示样式是从哪个元素继承的

Answer 2

如果使用 Firebug 没有帮助，我会在您的 CSS 中全局搜索“16px”，暂时删除该属性，看看是否有帮助。CSS 并不总是按预期运行，尤其是在不同的浏览器中。例如，不正确的代码格式会触发非常奇怪的行为。

此外，验证您的 XHTML/HTML 和 CSS。我发现这可以立即解决很多问题。

Answer 3

自 1.10 版以来， Firebug 的Computed侧面板允许您展开每个计算值以查看它的级联层次结构，这使得了解它是如何计算的变得容易。

例子：

在此示例中，您可以看到字体大小基本上是在规则中使用 selector 定义的.wmd-preview。