创建兼容ie6的html5页面
html5依然以.html或者.htm作为后缀。 号称几乎没人去记过的DOCTYPE声明变成<!DOCTYPE html>,这是能激活IE标准模式的最短字符。 指定字符集编码也同样简洁<meta charset = “UTF-8″>
html5新增了众多的元素，语义清晰。例如： 1.header 头部 2.nav 导航 3.article 文章 4.section 区块 5.aside 非主体文字，附属信息 6.footer 尾部 等等
这些元素里大概也只有section元素比较难懂一点。这个元素一般用于对网站及应用上内容进行分块，通常由标题和内容组成 ，所以如果是布局需要添加块状元素的话依然是推荐使用div。
大多数元素都是可以复用的，例如：
<header>
<nav></nav>
</header>
<section>
<header></header>
<article></article>
</section>
看完这些就可以创建基于html5的网页了。 这里有个小例子:
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>html5示例页面</title>
</head>
<body>
<header>这是页首</header>
<section>这是一个区块
<header>这是区块的TITTLE</header>
<article> 这是文字 </article>
<footer>这是section里的尾部</footer>
</section>
<footer>这是页尾</footer>
</body>
</html>
创建好以后自然需要各个浏览器都检测一下，发现使用ie8以下打开这个网页会发现一些小问题，因为比较早期的浏览器版本里面是没有这些html5元素的，解决问题的方法很简单，只需要在头部使用javascript来创建这些语义化元素就可以了。
<script>
document.createElement(“header”);
document.createElement(“footer”);
document.createElement(“article”);
document.createElement(“section”);
</script>
接下来还需要把这些元素的样式格式化一下，因为它们都是块状元素所以在style开始的部分加入
header, footer, article, section, header { display:block; }
再次检验一下，场面HOLD住了！就连IE6都没问题。
其他解决方法：
<!–[if IE]>
<script>
/*! HTML5 Shiv vpre3.6 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
Uncompressed source: https://github.com/aFarkas/html5shiv */
(function (a, b) {
function h(a, b) {
var c = a.createElement("p"),
d = a.getElementsByTagName("head")[0] || a.documentElement;
return c.innerHTML = "x<style>" + b + "</style>",
d.insertBefore(c.lastChild, d.firstChild)
}
function i() {
var a = l.elements;
returntypeof a == "string" ? a.split(" ") : a
}
function j(a) {
var b = {},
c = a.createElement,
f = a.createDocumentFragment,
g = f();
a.createElement = function (a) {
if (!l.shivMethods)
return c(a);
var f;
return b[a] ? f = b[a].cloneNode() : e.test(a) ? f = (b[a] = c(a)).cloneNode() : f = c(a),
f.canHaveChildren && !d.test(a) ? g.appendChild(f) : f
},
a.createDocumentFragment = Function("h,f", "return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&(" + i().join().replace(/\w+/g, function (a) {
return c(a),
g.createElement(a),
'c("' + a + '")'
}) + ");return n}")(l, g)
}
function k(a) {
var b;
return a.documentShived ? a : (l.shivCSS && !f && (b = !!h(a, "article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}audio{display:none}canvas,video{display:inline-block;*display:inline;*zoom:1}[hidden]{display:none}audio[controls]{display:inline-block;*display:inline;*zoom:1}mark{background:#FF0;color:#000}")), g || (b = !j(a)), b && (a.documentShived = b), a)
}
var c = a.html5 || {},
d = /^<|^(?:button|form|map|select|textarea|object|iframe|option|optgroup)$/i,
e = /^<|^(?:a|b|button|code|div|fieldset|form|h1|h2|h3|h4|h5|h6|i|iframe|img|input|label|li|link|ol|option|p|param|q|script|select|span|strong|style|table|tbody|td|textarea|tfoot|th|thead|tr|ul)$/i,
f,
g;
(function () {
var c = b.createElement("a");
c.innerHTML = "<xyz></xyz>",
f = "hidden"in c,
f && typeof injectElementWithStyles == "function" && injectElementWithStyles("#modernizr{}", function (b) {
b.hidden = !0,
f = (a.getComputedStyle ? getComputedStyle(b, null) : b.currentStyle).display == "none"
}),
g = c.childNodes.length == 1 || function () {
try {
b.createElement("a")
} catch (a) {
return !0
}
var c = b.createDocumentFragment();
returntypeof c.cloneNode == "undefined" || typeof c.createDocumentFragment == "undefined" || typeof c.createElement == "undefined"
}
()
})();
var l = {
elements : c.elements || "abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",
shivCSS : c.shivCSS !== !1,
shivMethods : c.shivMethods !== !1,
type : "default",
shivDocument : k
};
a.html5 = l,
k(b)
})(this, document)
</script>
<![endif]–>
上面是完整的代码，把代码全部放置到/head标签里面才能够起作用，因为他要在网页显示之前就判读是否是IE并且载入代码，上面的代码已经包含一整套的浏览器判断了，你只用复制即可。
<!–[if IE]> <script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script> <![endif]–>
上面这段是托管的JS代码，达到的效果和全代码的是一样的，但是速度更快，因为是托管的，稳定性就受到托管的影响了，你想要用哪一款呢？这个就看你的选择了。
