ie支持html5代码,使用 HTML5 Shiv 让 IE 支持 HTML5

这篇博客讨论了如何使iPad导航在Internet Explorer(IE)浏览器下正常布局。由于IE不支持HTML5标签,导致样式无法正确渲染。通过SjoerdVisscher的方法和remysharp的html5.js脚本,可以强制IE识别并渲染HTML5标签,从而改善在IE下的显示效果。该脚本需要在页面头部调用来确保IE在解析元素前知晓新的HTML5标签。
摘要由CSDN通过智能技术生成

现在越来越多浏览器已经实现支持 HTML5,其中 iPad 上的 Safari 浏览器对 HTML5 支持就非常完美,所以我们做的iPad 导航就是完全用 HTML5 写的。

IE 无法渲染 HTML5 样式

IE 的用户完全不是我们的目标用户,但是总有人说我们网站显示的乱七八糟,很烂,因为 IE 不知道如何给不能识别的标签或者元素渲染 CSS,比如 这些 IE 无法识别的标签,我们在 CSS 中定义的样式,IE 就无法渲染,所以还是决定让 iPad 导航至少在 IE 下能够布局正常一点。

前面说了 IE 对 HTML5 标签无法识别,所以无法渲染样式,而 Sjoerd Visscher 发现一种方法可以强制 IE 渲染 HTML5 标签,当你创建一个新的 DOM 元素(名字和它无法识别的标签相同)的时候,IE 就可以渲染,并且甚至无需插入这个元素,下面 blah 就能被渲染。

Hello!

remy sharp 整理了一个迷你的脚本 html5.js,通过上面的方法让 IE 支持所有的 HTML5 标签。

HTML5 Shiv使用

html5.js 必须在页面head元素内调用(因为 IE 必须在元素解析前知道这个元素,所以这个 JS 文件不能在页面底部调用。)

可以使用IE条件注释来调用这个 JS 文件,这样像 FireFox, Safari 等非 IE 浏览器就会忽视这段代码,也就不会有无谓的 HTTP 请求了。下面这段代码仅会在IE浏览器下运行:

最后大家可以看看效果 http://ipaddh.com/ 在 IE 下基本显示出来。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值