CSS属性没有被继承？

Question

我有以下代码：

<div style='width:50%;background:yellow;margin:0 auto;padding:20px;font-family:Calibri;'>
    Parent div
    <div style='background:lime;'>
      Child div
    </div>
</div>

这里样式font-family:Calibri;在子div中自动继承，而其他样式保持继承（未继承） .

这是DEMO。

DEMO after defining same padding for child-div.

如您所见，结果不相同。

为什么会这样？有没有继承的特定样式？如果有，它们是什么？

Answer 1

有些属性是继承的，有些不是。

• width。继承：否
• background。继承：否
• margin。继承：否
• padding。继承：否
• font-family。继承：是

如果您希望某个元素从其父级继承不可继承属性的值，您可以使用inherit value。

---

我建议阅读规范的Inheritance 部分：

某些值由文档树中元素的子元素继承，如上所述。每个属性都定义了它是否被继承。

当发生继承时，元素继承计算值。父元素的计算值既成为指定值又成为子元素的计算值。

每个属性也可以有一个级联值“继承”，这意味着，对于给定的元素，该属性采用与该元素父级的属性相同的指定值。 'inherit' 值可用于强制继承值，也可用于通常不被继承的属性。