HTML5 shiv 在 ie8 中打破页面答案

【问题标题】：HTML5 shiv breaks page in ie8HTML5 shiv 在 ie8 中打破页面
【发布时间】：2012-09-18 00:47:26
【问题描述】：

我是 html5 的初学者。当我尝试调用 html5 shiv 时，页面不会在 ie8 中呈现。仅加载背景。

我正在添加以下内容

<header>
<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js">     </script><![endif]-->   
<script>
  document.createElement('header');
  document.createElement('nav');
  document.createElement('hgroup');
  document.createElement('section');
  document.createElement('article');
  document.createElement('aside');
  document.createElement('footer');
   </script>

css:

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {     display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

请帮忙！

【问题讨论】：

标签： html internet-explorer-8

【解决方案1】：

您不必使用 document.createElement 创建所有元素 - shiv 会为您完成。
在您的 CSS 中，您为 IE8 创建了所有新元素 inline，但是它们在好的浏览器中自然会被阻止。尝试使它们保持一致并使用 Normalize CSS 中的规则，例如：

    /*
    * Corrects `block` display not defined in IE 8/9.
    */

    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    nav,
    section,
    summary {
        display: block;
    }

    /*
    * Corrects `inline-block` display not defined in IE 8/9.
    */

    audio,
    canvas,
    video {
        display: inline-block;
    }

    /*
    * Prevents modern browsers from displaying `audio` without controls.
    * Remove excess height in iOS 5 devices.
    */

    audio:not([controls]) {
        display: none;
        height: 0;
    }

【讨论】：