您好,登錄后才能下訂單哦!
小編給大家分享一下如何讓IE支持HTML5,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
越來越多的站點開始使用 HTML5 標簽,但是目前的情況是還有很多人在使用IE6、IE7、IE8。為了讓所有瀏覽者都可以正常的訪問,解決方案有下面兩個
越來越多的站點開始使用 HTML5 標簽,但是目前的情況是還有很多人在使用IE6、IE7、IE8。為了讓所有瀏覽者都可以正常的訪問,解決方案有下面兩個:
1.為網站創建多套模板,通過程序對User-Agent的判斷為不同的瀏覽器用戶顯示不同的頁面,例如:優酷網。
2.使用Javascript來使不支持HTML5的瀏覽器支持HTML標簽。
針對IE比較好的解決方案是html5shiv。htnl5shiv主要解決HTML5提出的新的元素不被IE6-8識別,這些新元素不能作為父節點包裹子元素,并且不能應用CSS樣式。讓CSS 樣式應用在未知元素上只需執行 document.createElement(elementName) 即可實現。html5shiv就是根據這個原理創建的。
html5shiv的使用非常的簡單,考慮到IE9是支持html5的,所以只需要在頁面head中添加如下代碼即可:
復制代碼
代碼如下:
<!-–[if lt IE 9]--><script src=" http://html5shiv.googlecode.com/svn/trunk/html5.js "></script ><!--[endif]–- >
下面是一些補充:
當然包括本人BLOG在內。關于HTML5不得不提IE,在蘋果、Google、Opera和Mozilla等主流瀏覽器廠商積極參與新版本HTML標準的制定和推廣時,微軟卻對HTML 5規范不屑一顧。然而微軟近期才表態要在IE中支持HTML 5,以致到今天為止的IE8及以下是無法支持HTML5標簽的。但在sitepoint找到了讓IE支持HTML5辦法。
以下是在的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中顯示的效果如下:
sitepoint例子中創建節點的JavaScript代碼似乎過于臃腫,在smashingmagazine提供的代碼似乎更簡潔。
演示如下
提示:您可以先修改部分代碼再運行
復制代碼
代碼如下:
<!--[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; }
以上是“如何讓IE支持HTML5”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。