關於讓bootstrap3兼容ie8


官網上有說Internet Explorer 8 和 9 是被支持的,然而,你要知道,很多 CSS3 屬性和 HTML5 元素 -- 例如,圓角矩形和投影 -- 是肯定不被支持的。另外,  Internet Explorer 8 需要 Respond.js 配合才能實現對媒體查詢(media query)的支持。
 
不過由於學的不夠,在兼容ie8上浪費了太多時間摸索,接下來就給大家介紹一下我的摸索過程,僅供同樣是菜鳥的童鞋參考。
 
同樣是官網上說的,由於瀏覽器的安全機制,Respond. js不能直接在本地訪問的頁面上發揮正常的功能,如果需要測試ie8響應式特性, 必須通過http協議訪問頁面(例如搭建apache、nginx等)。
 
 
通過http協議訪問頁面是重點,我是這么做的:
1、將需要的文件引入(官網有頁面基本框架  http://v3.bootcss.com/getting-started/#template
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 上述3個meta標簽*必須*放在最前面,任何其他內容都*必須*跟隨其后! --> <title>Bootstrap 101 Template</title> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9]> <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> <![endif]--> </head> <body> <h1>你好,世界!</h1> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> </body> </html>
2、搭建本地服務器,下載wampserver,然后安裝,安裝好打開后可以在桌面底部看到綠色w圖標 ,點開圖標到Apache,打開文件httpd.conf,然后修改數字127.0.0.1改為all。
3、將你的index.html頁面放到圖標那里的 www目錄(w)
4、然后http://localhost /root/index.html就能訪問了
 
然后ie8一看,果然正常了。
 
 
 


免責聲明!

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



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