当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 让IE支持HTML5办法

HTML/XHTML教程
网页页面 自动刷新的3种代码
网页制作 TD也可以溢出隐藏显示
网页设计 TabIndex元素
HTML非常用标签 optgroup、sub、sup和bdo示例代码
html超级链接标记A的TARGET属性详解
语义化的网页 XHTML语义化标记
各种MOUSE鼠标形状的表示方法
左右移动转换文字特效HTML代码解析
IE6的BUG及修复 谓防患于未然的策略
编写email邮件的HTML页面原则小结
熟手的html编写风格与原因分析
常见的HTML标记错误写法
html 块级标签与内联标签的区别
IE6的BUG及修复:谓防患于未然的策略
制作编写HTML邮件的编写原则
HTML Symbol Entities美化网页小图标
HTML代码编写的常用5个原则以及原因
HTML基础教程:常见的HTML标记错误写法
经验分享:淘宝网店网页标题优化和宝贝橱窗推荐
W3C验证XHTML常见的5个错误

HTML/XHTML教程 中的 让IE支持HTML5办法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-03   浏览: 40 ::
收藏到网摘: n/a

HTML5预计是在2022年发布,但我认为它距离我们并不是那么遥远,因为在html5gallery就例举了大量正在使用HTML5的站点,当然包括本人BLOG在内。关于HTML5不得不提IE,在苹果、Google、Opera和Mozilla等主流浏览器厂商积极参与新版本HTML标准的制定和推广时,微软却对HTML 5规范不屑一顾。然而微软近期才表态要在IE中支持HTML 5,以致到今天为止的IE8及以下是无法支持HTML5标签的。但在sitepoint找到了让IE支持HTML5办法。

以下是在的IE 8显示的例子,未作处理前:
在IE 8显示的例子,未作处理前
让IE(包括IE6)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE在对象中创建对应的节点。

<!--[if IE]>
<script>
document.createElement("header");
document.createElement("footer");
document.createElement("nav");
document.createElement("article");
document.createElement("section");
</script>
<![endif]-->

添加以上代码后,在IE8中显示的效果如下:
在IE 8显示的例子,处理后

sitepoint例子中创建节点的JavaScript代码似乎过于臃肿,在smashingmagazine提供的代码似乎更简洁。
Demo:http://blog.gulu77.com/demo/200908/html5_demo3.html

<!--[if IE]>
<script>
(function(){if(!/*@cc_on!@*/0)return;var e = "header,footer,nav,article,section".split(','),i=e.length;while(i--){document.createElement(e[i])}})()
</script>
<![endif]-->

HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素,如下例:

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