首页 > 代码库 > 用html5构建兼容iE6的网页
用html5构建兼容iE6的网页
几个月前我就打算开始学习html5，但是当时有一个非常扯淡的想法：“反正现在很多浏览器不兼容html5，学了实际用途也不会很大!”而且还有一些其他的事情比较牵扯精力(找理由…)!现在我终于意识到那时的那个想法有多么二了，赶紧亡羊补牢。
创建兼容ie6的html5页面
html5依然以.html或者.htm作为后缀。 精心开发5年的UI前端框架！
号称几乎没人去记过的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的网页了。
这里有个小例子:精心开发5年的UI前端框架！
<!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都没问题。呼应开头，兼容性问题不能成为不学html5的理由！
注意！！！（2012年3月31日最新更新）
经过在具体项目中对HTML5的使用后发现，使用AJAX载入的内容如果含有HTML5元素将无法在IE中被创建。
所以如果项目中需要运用AJAX技术并对兼容性要求较高，暂不建议使用HTML5元素!精心开发5年的UI前端框架！
用html5构建兼容iE6的网页