HTML5 不支持的浏览器该怎么办？

由于 HTML5 近年更新的版本，对于某些浏览器来说可能不支持，导致打开页面后出现乱码、排版错乱等。为了避免出现这个情况，下面的方法可以帮到你。

把 HTML5 元素定义为块级元素

HTML5 定义了八个新的语义 HTML 元素，都是块级元素。我们可以把 CSS display 属性设置为 block，以确保老式浏览器中正确显示，代码如下：

header, section, footer, aside, nav, main, article, figure {
    display: block; 
}

对于 Internet Explorer 我们可以先进行版本判断，如果是ie9 更早的版本则加载html5.js来定义元素。代码如下：

<!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

我们也可以手动设置 JavaScript 语句 document.createElement(“HtmlHero”)，仅适用于 IE。

<!DOCTYPE html>
<html>
<head>
  <title>Creating an HTML Element</title>
  <script>document.createElement("HtmlHero")</script>
  <style>
  HtmlHero {
    display: block;
    background-color: #ddd;
    padding: 50px;
    font-size: 30px;
  } 
  </style> 
</head>
<body>
<p>ZHUEi</p>
<HtmlHero>ZHUEi</HtmlHero>
</body>
</html>

如果你发现错误或有其他见解，请给www.zhuei.com留言，我们会尽快更新本文！