尚学堂-成都java培训机构
尚学堂联系方式028-65176856
html5shiv让IE支持HTML5标签_web前端
当前位置:主页 > 编程资讯 > html5shiv让IE支持HTML5标签_web前端

html5shiv让IE支持HTML5标签_web前端

成都尚学堂java培训     发布时间:2017-10-23
html5给前端开发带来了很多的便利,最为便利的那便是语义化标签的应用,越来越多的站点开始使用 HTML5 标签。在标准浏览器上,HTML5支持的也非常好,但是我们不得不考虑到前端开发中让我们最头疼的IE浏览器。目前还有很多人在使用IE6、IE7、IE8,这些客户我们不能忽视,为了让他们也能正常浏览页面,我们必须想办法解决这个问题。



其实解决IE6-IE8支持HTML5标签有很多种方法,我们今天重点说一下html5shiv,这也是我们常用的一种方法。



html5shiv的使用非常的简单,考虑到IE9是支持html5的,所以只需要在页面head中添加如下代码即可:



<!–[if lt IE 9]>

<script src="http://github.com/html5shiv/r29/html5.min.js"></script>

<![endif]–>



将上代码复制到head部分,记住一定要是head部分(因为IE必须在元素解析前知道这个元素,所以这个js文件不能在其他位置调用,否则失效)



另外CSS还需要重置一下HTML5标签的样式



article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section



{display:block}



主要是让这些html5标签成块状,像div那样。



当然如果你需要的元素可知,并且是很少,只需要添加以下js代码在头部就可以:



<!--[if lt IE 9]>

<script>

document.createElement("header");

document.createElement("footer");

document.createElement("nav");

document.createElement("article");

document.createElement("section");

</script>

<![endif]-->



或者



<!--[if IE]>

<script>

(function(){if(!/*@[email protected]*/0)return;var e = "header,footer,nav,article,section".split



(','),i=e.length;while(i--){document.createElement(e[i])}})()

</script>

<![endif]-->



你需要哪个元素就添加那句,比如你只需要canvas这个。你只需要添加下面代码即可

<!--[if lt IE 9]>

<script>

document.createElement("canvas");

</script>

<![endif]-->



成都尚学堂是一家专业的web前端培训机构,是由人社局审批成立的教育培训机构,为IT行业输送大量的人才,学web前端开发,就到成都尚学堂,先就业再付款,实现职场人生华丽的转变。

一定要看:报名软件测试工程师培训班要准备哪些基础知识


以上便是关于“html5shiv让IE支持HTML5标签_web前端”的详细内容!
上一篇:年纪大,学历低可以去学UI设计吗?
下一篇:成都较好的IT培训学校_尚学堂的优势