實現IE6-Ie8媒體查詢


停下來,不代表要放棄,只是在自我調整尋找一個最好狀態的自我。所以在沒對自己說“放棄”就不會放棄。

..............................................................以下是正文............................................................

css3添加的樣式,圓角、漸變、動畫等讓每個前端眼前一亮,特別是媒體查詢更讓頁面的編寫者為之瘋狂,寶寶編寫的頁面可以適配不同的設備不同的分辨率,是一件多么興奮的是,一勞永逸啊!!!

但是作為前端的公敵的IE,當然不放過這么好的機會制造事端,哈哈,上有政策下有對策。當然只是IE6-IE8。

如有需要,則請繼續往下看:

一、bootStrap對IE6兼容解決

bsie能在IE6上支持大部分bootstrap的特性,可惜,還有一些實在無法支持...

下面的這個表格就是當前已經被支持的bootstrap的組件和特性:

 

.......

詳情請訪問網站:  http://www.bootcss.com/p/bsie/

二、媒體查詢兼容

不支持CSS3 Media Queryes特性的瀏覽器能夠支持響應性設計,尤其是小於等於8的ie瀏覽器。 解決方法是Respond.js插件

Respond.js缺陷

1.腳本僅僅對min-width 和 max-width media queries 以及所有的media types(screen,print,等等)不支持的瀏覽器提供支持,引用Respond.js腳本,放到所有css文件之后(它越早運行,ie用戶看到非media內容的閃爍的幾率越小)。

2.由於瀏覽器的安全機制,Respond.js 不能在通過 file:// 協議(打開本地HTML文件所用的協議)訪問的頁面上發揮正常的功能。如果需要測試 IE8 下面的響應式特性,務必通過 http 協議訪問頁面

3.Respond.js 不支持通過 @import 指令所引入的 CSS 文件。例如,Drupal 一般被配置為通過 @import 指令引入CSS文件,Respond.js 對其將無法起到作用。

4.寬域問題,如果 Respond.js 和 CSS 文件被放在不同的域名或子域名下面時需要一些額外的設置,參考http://my.oschina.net/ximidao/blog/349130


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM