时间戳

首页 > 解决方案 > 为什么我的嵌套段落不尊重字体大小样式？

html - 为什么我的嵌套段落不尊重字体大小样式？

问题描述

如果我有这个

.outer {
   font-size: 2em;
 }
<div class="outer">
    Some Outer Div Text
    <div class="inner">
       Some Inner Div Text
    </div>
</div>

两个文本都是 32px (16px *2)

但是使用此 HTML：

 <p class="outer">
    Some Outer Div Text
    <p class="inner">
       Some Inner Div Text
    </p>
  </p>

外部文本为 32px，内部文本为 16px。

为什么段落标签不像 div 标签那样尊重父级的字体大小？我认为它们都是相同的，因为它们都是块元素？

如果我不清楚，这是一个 JSFiddle：https ://jsfiddle.net/scottfwalter/2Lrd6tzm/

标签： htmlcssfont-size

解决方案

简单的答案是您不能嵌套 p 标签，如果您打开控制台并检查，您会看到 2 p 标签是兄弟姐妹而不是父/子，因此没有继承。
有关更多详细信息，请参阅此答案嵌套 <p> 不起作用，而嵌套 <div> 会？

推荐阅读