html - IE 中的 HTML 页眉和页脚标签问题

Question

在我的 HTML 中，我使用了<header>和<footer>标签，但是当我在 IE 中检查它时，它没有呈现——布局被破坏了。那是因为HTML版本吗？我尝试删除这些标签，然后我的布局没有中断。

这是我的代码：

<header id="main-header"> 
<div class="navigation-wrapper">
<hgroup id="logo">
    <a href="/"><h1><span class="hide">Heading</span></h1></a>
</hgroup>
<div id="dd" class="wrapper-dropdown-5" tabindex="1"> 
    <ul class="dropdown"> 
        <li>
            <a href="#"><i class="icon-user"></i>Profile</a>
        </li> 
        <li>
            <a href="#"><i class="icon-cog"></i>Settings</a>
        </li>
        <li>
            <a href="navotar.com/"><i class="icon-remove"></i>Log out</a>
        </li> 
    </ul> 
</div>
</div>
</header>

Answer 1

旧版本的 IE 无法设置它们无法识别的元素样式，因此它们不会呈现在浏览器发布后引入的元素。

幸运的是，有一种解决方法：

<!--[if lt IE 9]>
<script type="text/javascript">
document.createElement('header'); document.createElement('footer');
</script>
<![endif]-->

您还可以使用 HTML5shiv 或 modernizr 来为整个 HTML5 元素集执行此操作。