1. 程式人生 > >H5 IE9及以下版本相容h5新標籤

H5 IE9及以下版本相容h5新標籤

使用他們能讓程式碼語義化更直觀,而且更方便SEO優化。但是此HTML5新標籤在IE6/IE7/IE8上並不能識別,需要進行JavaScript處理。
如果是IE9及以下的IE瀏覽器將建立HTML5標籤。

<!--[if lt IE9]> 
<script type="text/javascript">
(function(){if(!/*@[email protected]*/0)return;var e ="abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i])}})();
</script>
<![endif]-->

新增 CSS 樣式

article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}

這樣,IE9及以下版本就可以使用h5標籤了。

相關推薦

H5 IE9以下版本相容h5標籤

使用他們能讓程式碼語義化更直觀,而且更方便SEO優化。但是此HTML5新標籤在IE6/IE7/IE8上並不能識別,需要進行JavaScript處理。如果是IE9及以下的IE瀏覽器將建立HTML5標籤。 <!--[if lt IE9]> <script type="text/javascr

IE9以下版本獲取上傳文件的大小

color create file ive log hrl ext sys pwd IE9及以下版本不能識別files屬性;獲取圖片需要設置瀏覽器 打開IE_工具_internet選項_安全_自定義級別。 啟用ActiveX,開啟跨域; var fso=new Act

解決IE9以下版本對placeholder的相容性問題

解決IE9及以下版本對placeholder的相容性問題 placeholder屬性可以對input輸入框輸入內容的提醒或者指引 但在IE9及IE9以下不支援 placeholder 屬性 優化示例: <!DOCTYPE html> <html lang="e

相容IE8以下不識別HTML5標籤和css3 media query的方法

<!--[if lt IE 9]>   <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.js"></script>    <script src="http://cd

IE9以下版本檢測提示升級

//瀏覽器版本過低 提示升級 (function(w) { if(!("WebSocket" in w && 2 === w.WebSocket.CLOSING)) {

requestAnimationFrame()請求動畫幀的相容IE9以下寫法

相容性 IE9及以下 與setTimeout()對比 不需要設定時間間隔,會貼合瀏覽器的重新整理頻率。 在切到另外的頁面時,會停止運動。(sertTimeout還會執行,但速度變慢) <head> <meta cha

.net 4.0以下版本,MVVM模式ViewModel基類:使用StackTrace實現INotifyPropertyChanged介面

using System; using System.ComponentModel; namespace SSMart_Model {     public class VModelBase: INotifyPropertyChanged, IDisposable    

Electron 4.0.0 釋出,不再支援 macOS 10.9 以下版本

   Electron 4.0.0 已釋出,Electron 是 GitHub 釋出的跨平臺桌面應用開發工具,支援 Web 技術開發桌面應用,其本身是基於 C++ 開發的,GUI 核心來自於 Chrome,而 JavaScript 引擎使用 V8。 此版本主

使用document.getElementsByClassName 老版本IE9以前的版本相容

/** * 根據類名查詢元素,解決瀏覽器相容問題 * @param className <String> 待查詢的類名 * @return 返回查詢到的元素集合 */function byClass(className) {   if (document.getElementsByClassNam

解決IE8以下版本css3圓角不能顯示的問題

PIE.htc檔案其實就是js程式碼,使用的時候有時候很奇怪,載入了一次後貌似會一直在,發現這個問題是因為偶然的一個機會behavior:url(../js/PIE.htc);解決了一個IE7下的bug。在我的專案中,我給em元素的包含元素設定了height和line-height,line-height可以

Xcode8 支援 iOS7以下版本

Xcode8 預設只支援iOS8及以上的平臺,如果想相容iOS7以及更低的版本,應該怎麼辦呢? 下載Xcode支援的平臺版本 拷貝版本到Xcode的DeviceSupport目錄 將自己需

一個簡單的手電筒APP原始碼分享(支援Android O(8.0)以下版本

一個簡單的手電筒APP(無閃光燈的裝置開啟螢幕照明模式) GitHub地址: 打包下載 程式碼分析 Android 5及以下 需要使用類: android.hardware.Camera 開啟手電 private Camera ca

訪問Tomcat7以下版本時(HttpServeltRequest請求時)的中文亂碼解決問題

訪問Tomcat7及以下版本時(HttpServeltRequest請求時)的中文亂碼解決問題   總的來說,亂碼的解決方式是根據請求方式的不同而去選擇取用何種方式解決棘手的亂碼問題的。   先說post方式提交到Tomcat伺服器,Tomcat解析時出現的

13.04以下版本Ubuntu升級Vim到7.4

需要調一個C的小工程,嘗試安裝Vim上大名鼎鼎的自動補全外掛YCM,也就是YouCompleteMe 從github上裝好YCM,直接執行vim,收到以下資訊: YouCompleteMe unavailable: requires Vim 7.3.584+ 需要Vim至少

android M 以上版本將應用增至忽略電池優化

/** * 忽略電池優化 */ private void ignoreBatteryOptimization(Activity activity) { if

Mybatis3.4.0不支援mybatis-spring1.2.5以下版本

今天將工程的Mybatis的版本由3.3.0升級到3.4.0導致程式執行錯誤,使用的mybatis-spring版本是1.2.3,錯誤內容如下,最後發現是SpringManagedTransaction類中沒有getTimeout函式,所以導致這個錯誤出現。java.lang

Cassandra_教程一_Cassandra的簡單操作_基於(cassandra-cli) 需要 2.2 以下版本

本文基於Cassandra2.1.15,    Cassandra2.1.15  是擁有cassandra-cli 元件的最後一個版本。從 2.2開始 cassandra-cli元件就被移除了。

pageoffice在Edge瀏覽器、谷歌瀏覽器42以上版本和火狐瀏覽器52以上版本相容處理

Edge瀏覽器、谷歌瀏覽器42及以上版本和火狐瀏覽器52及以上版本做了比較大的升級,內容是禁止了所有的外掛。 不光是pageoffice其他的外掛也用不了,如果想在這樣瀏覽器上開啟pageoffice,使用pageoffice的新特性pageofficelink方法開啟文件

IE9以下版本兼容h5標簽

運用 itl rom str 瀏覽器中 好的 項目 afa 陌生 隨著html5(後面用h5代表)標簽越來越廣泛的使用,IE9以下(IE6-IE8)不識別h5標簽的問題讓人很是煩惱。 在火狐和chrome之類的瀏覽器中,遇到不認識的標簽,只要給個display:block屬

安裝php7安裝memcache擴展出現的舊php版本相容擴充套件的問題

yum install -y php-mcrypt libmcrypt libmcrypt-devel yum -y install libjpeg libjpeg-devel libpng libpng-devel freetype freetype-de