今天把新写好的一个用HTML5写的页面放到IE浏览器上去查看兼容性,结果发现整个布局都出现了问题,突然意识到之前一直使用Chrome浏览器的,所有一直没有考虑关于IE浏览器的兼容问题
IE6-8支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,浏览器支持新标签后,还需要添加标签默认的样式。所有在head标签中加入了如下代码
<!--[if IE]>
<script>
document.createElement("header");
document.createElement("footer");
document.createElement("nav");
document.createElement("article");
document.createElement("section");
</script>
<![endif]-->
<style>
header,footer,nav,arrticle,section{ display: block; }
</style>
然而坑爹的是布局依然没有变,这时我才意识到我电脑上的IE版本好像是IE8(好吧,我承认,电脑买的早,根本没考虑这么多)
所有,对于上述的方法,对于IE9以下是行不通的,所有只能使用框架了,这里我用的是html5shiv
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"> </script>
<![endif]-->
这个是直接在百度上找的资源。比较懒,就没有下载到本地。。。