css字体大小继承不适用答案

【问题标题】：css font-size inheritance not applyingcss字体大小继承不适用
【发布时间】：2014-04-13 22:33:43
【问题描述】：

我的结构如下

<div class="panel">
    <div class="product">
        <div class="title">My little pony</div>
    </div>
</div>

标题 div 设置了字体大小，面板 div 也设置了。

.panel {
    font-size: 0.89em;
}
.product .title {
    font-size: 1em;
    font-weight: bold;
    height: 3.8em;
    line-height: 1.2em;
}

当我在浏览器中查看此内容时，似乎面板类的字体大小正在应用于标题 div，萤火虫确实将面板样式显示为被划掉，但在切换标题 div 上的字体大小时它对大小没有影响。

如果我切换面板类字体大小，那么我可以看到我期待的变化。

这是怎么回事，我错过了什么明显的东西吗？

注意：css已被简化

【问题讨论】：

这适用于我在 FFx 和 Chrome 中，都是最新的。您是否针对特定浏览器？ jsfiddle.net/qQW37
jsve 在下面有它，当它的 1 与父容器相关时，因此将其设置为大于 1 有效
这与继承无关。你应该解释你想要什么，展示你是如何尝试的，并说出结果有什么问题。现在这个问题甚至没有具体说明目标是什么。
好吧，我不知道问题不在于继承，所以据我所知，我已经问过这个问题，我确实展示了我已经拥有的东西，我尝试过的东西（使用 firebug）。我会告诉你，目标本来可以更明确

标签： html css

【解决方案1】：

font-size 正在被覆盖（这就是为什么您会在 Firebug 中看到它被划掉），但由于 ems 的相对性，它实际上并没有做任何事情。

1em = 父元素的字体大小。在您的情况下，这是.panel 和font-size: 0.89em。所以将.product .title的font-size设置为1em不会影响结果。

计算所需任何像素值的等效 em 的公式

1 ÷ parent font size (px) × required pixels = em equivalent

根据这个公式，要获得所需的字体大小，您需要将其设置为：

1.1235955056179775280898876404494

注意：浏览器无法渲染十亿分之一的像素，因此实际上只需要几个小数位。

【讨论】：

因此，如果没有应用外部字体大小，是否可以让字体大小显示出来，而无需实际删除外部字体大小。试图看看我是否可以在不更改一些 css 的情况下逃脱，但我猜它不会工作。
如果我的数学是正确的，我想我需要将它设置为大约 1.12em
@DanielPowell 是的。请参阅我的编辑，了解您需要将其设置为的（几乎）确切值。