为什么div中的字体大小不同？ [复制]

Question

我为所有 div 赋予了相同的字体大小（2em）。但是#left 和#right 中的字体大小显然更大。我不知道为什么浏览器会给出这个结果。

这是一个代码sn-p：

div {
  color: white;
  font-size: 2em;
}

#header {
  width: 100%;
  height: 120px;
  background: #99ff00;
}

#main {
  width: 100%;
  height: 400px;
  background: #99ff99;
}

#left {
  width: 30%;
  height: 100%;
  float: left;
  background: #999999;
}

#right {
  width: 70%;
  height: 100%;
  float: left;
  background: #553344;
}

#footer {
  clear: both;
  width: 100%;
  height: 80px;
  background: #66ff66;
}

<div id="header">header</div>
<div id="main">
  <div id="left">left</div>
  <div id="right">right</div>
</div>
<div id="footer">footer</div>

Answer 1

div 默认字体大小为 16px。

父容器<div id="main"> 具有属性font-size:2em;。表示font-size为32px（parent-container-font-size*2）。

#right 和 #left 块也是如此，它们具有属性font-size:2em;。也就是说font-size是64px（parent-container-font-size*2）。