html - 为什么 <h1> 中的 <h2> 不继承 color 属性的值？

Question

看这个简单的例子:

<style>
   h1 {
      color: red;
   }
</style>

<h1>this is the 'h1'.<h2>this is the 'h2'</h2></h1>

我希望 'h2' 中的字符串颜色为红色，但它仍然是黑色。

这让我困惑了一段时间。为什么会这样？

Answer 1

安 <h1> 元素不允许包含 <h2>元素(除其他外；仅允许 phrasing elements 和文本)，因此根据规范，这是无效的 HTML。

浏览器尝试通过考虑 <h2> 来补偿无效的 HTML实际上在 <h1> 之外, 这导致观察到的结果。