Css 使用em单元时字体大小不正确

我的代码的默认

font size

相当于

10px

或

0.625em

。因此，根据此规则，要将

的字体大小设置为

7px

，我可以使用

0.7em

。但在我的情况下，浏览器采用固定的字体大小

9px

（在浏览器的“计算”部分中选中），即使我将

的字体大小减小为

0.5em

或更小

正文{
字号：0.625em；
}
h1{
字号：2.5em；
}
氢{
字号：1.875em；
}
p{
字体大小：0.7em；
}

这是标题1
这是标题2
这是一段

在em中指定字体大小允许所有主要浏览器调整文本大小。
不幸的是，旧版本的IE仍然存在问题。当调整文本大小时，它会变得比应该的大/小。

如果您希望字体大小与根字体大小严格相关（这是在

html

规则中设置的，而不是

body

，并且应该是

px

），您必须使用

rem

单位或百分比，但不能使用

em

（这与特定元素或其父元素的默认浏览器大小有关）

另外，大多数浏览器都有一个“最小字体显示”设置，以防止小字体变得不可读。很可能在浏览器中设置为9px。

正如您所说的p的字体大小为7px，我可以使用0.7em，这是不正确的，因为这里的默认字体大小是16px。如果

10px == 0.625em then
7px = (0.625/10)*7em = 0.4375em

如果使用

10px

作为默认字体，则必须在

px中设置
正文和
html字体大小

html,
body {
  font-size: 10px;
}

检查下面的代码片段


html{
字体大小：10px；
}
h1{
字号：2.5em；
}
氢{
字号：1.875em；
}
p{
字体大小：0.7em；
}
这是标题1
这是标题2
这是一段

在em中指定字体大小允许所有主要浏览器调整文本大小。不幸的是，旧版本的IE仍然存在问题。当调整文本大小时，文本会变得比应该的大/小。
您无法设置

body {
  font-size: 0.625em;
}

您需要将
10px
设置为正文字体大小然后使用
em
计算将按照您的预期进行。否则，它将采用浏览器设置的默认
字体大小。


正文{
字体大小：10px；
}
h1{
字号：2.5em；
}
氢{
字号：1.875em；
}
p{
字体大小：0.7em；
}
这是标题1
这是标题2
这是一段

在em中指定字体大小允许所有主要浏览器调整文本大小。
不幸的是，旧版本的IE仍然存在问题。在调整文本大小时，它变大了/变小了。
这真的很奇怪-在你的代码片段结果中，计算的样式告诉我字体大小是7px，在chrome中对我来说很好-显示为7px-你确定你的浏览器没有设置为使用用户设置而不是样式表吗？也许值得在px中设置
html
字体大小以使其更大所有浏览器上的大小都相同。此外，由于工具的质量和代表性，我建议使用Chrome或Mozilla进行调试，而不是Safari。我可以在px中设置字体大小，也可以将默认字体大小更改为6px，并使用等效的em值，但仍然希望修复此问题。谢谢！这解决了我的问题。但我只是好奇浏览器是如何接受9px的默认值的？@AKNair老实说，我真的无法重现你所面临的问题。我只知道如何解决它。这使得很难回答为什么它是
9px
。我想你很可能在你的设置中设置了最小字体大小。（另一个原因可能是一些舍入问题（16*0.625=10，但16*0.6=9.6），但我认为这不是问题所在。感谢您的回复！刚刚从Johannes那里得到了关于9px的答案。