为何em未将定义的字体大小放大一倍？

你遇到的问题不是浏览器bug，也不是样式继承机制的问题，而是HTML标签书写错误导致的：

在你的HTML代码中，两个<p>标签的闭合标签都写成了</px>（多了一个x），浏览器无法正确识别闭合标签，因此带.go-big类的<p>元素并没有正确继承到你为<p>设置的24px字体大小，而是使用了浏览器默认的16px字体大小，最终2em计算后得到32px。

修正后的代码 #

样式代码（无需修改）

p {
  font-size: 24px;
}
.go-big {
  font-size: 2em;
}

HTML代码（修正闭合标签）

<p>This should be 24 px</p>
<p class="go-big">This should be 48 px?</p>

补充说明 #

em单位的计算逻辑是：相对于当前元素继承的字体大小（若元素自身未设置字体大小，则继承父级；若没有父级设置，则使用浏览器默认值）。修正标签后，.go-big的<p>元素继承了24px，2em就会计算为24px × 2 = 48px，符合你的预期。

内容的提问来源于stack exchange，提问作者DeborahK