HTML5 标签在旧浏览器中呈现为 div 吗？答案

【问题标题】：Do HTML5 tags render as div in older browsers?HTML5 标签在旧浏览器中呈现为 div 吗？
【发布时间】：2014-05-17 14:11:14
【问题描述】：

根据我的阅读（IE 6 - 8 除外），旧版浏览器将以下 HTML5 标记视为内联：

文章、旁白、导航、部分、页脚

如果在现代浏览器中打开以下 html：

this is the <article>article</article> tag.

它会像这样呈现：

this is the
article
tag

为什么 HTML5 标签在现代浏览器中被视为块级标签，而在旧浏览器中被视为内联？

我还在某处读到旧版浏览器将 HTML5 标签视为 div，这意味着块级别。但是，对于旧版浏览器如何处理这些标签，我没有明确的答案。

【问题讨论】：

可以复制stackoverflow.com/questions/14891543/…
完全不同。
This 可能有用。
@null：很好的资源。看起来旧版浏览器可以通过多种方式而不是单一方式来处理这种情况。
@null：你能发帖回答吗？我会接受的。

标签： html

【解决方案1】：

目前为止我找到的最好的资源是this article，下面的sn-ps就是从这里获取的：

当 HTML5 元素被在页面中使用：

标签被认为是一个错误并被完全忽略。 DOM 是就像标签不存在一样构造。

标签被认为是一个错误，并创建了一个 DOM 节点作为占位符。 DOM 的构造如代码所示，但标记未应用任何样式（视为内联元素）。

标签被识别为 HTML5 标签，并创建了一个 DOM 节点以代表它。 DOM 的构造如代码所示，并且标签应用了适当的样式（在许多情况下，作为一个块元素）。

作为一个具体的例子，考虑以下代码：
<div class="outer">
    <section>
        <h1>title</h1>
        <p>text</p>
    </section>
</div>
许多浏览器（例如 Firefox 3.6 和 Safari 4）会将其解析为具有未知子元素 (<section>) 的顶级 <div> 元素在 DOM 中创建，但被视为内联元素。 <h1> 和 <p> 元素是 <section> 的子元素。因为<section> 是在 DOM 中表示，可以设置元素的样式。这是案例 #2。

9 之前的 Internet Explorer 将其解析为顶级但看到 <section> 错误。所以<section> 被忽略，然后<h1> 和<p> 被解析，都成为<div> 的孩子。关闭</section> 是也被视为错误并被跳过。对此的有效理解浏览器中的代码相当于：
<div class="outer">
    <h1>title</h1>
    <p>text</p>
</div>
所以旧的 Internet Explorer 浏览器实际上可以很好地从未知元素，但创建与其他元素不同的 DOM 结构浏览器。因为没有未知的 DOM 表示元素，您也不能将样式应用于 .这是案例 #1。

当然，支持 HTML5 的浏览器，例如 Internet Explorer 9、Firefox 4 和 Safari 5 创建正确的 DOM 结构并应用更正 HTML5 中指定的该元素的默认样式。

【讨论】：