天天看點

讓bootstrap相容ie6 ie7 ie8 ie9 ie10 ie11的解決方法

前兩天遇到要bootstrap相容ie各個版本的問題,但是各種百度,各種部落格,最後算是解決了,但是迷迷糊糊的,現在來總結一下,如有雷同純屬總結。
首先看看代碼的模樣:
           
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<title> </title>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.5-dist/css/bootstrap.css"  media="screen"/>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.5-dist/css/bootstrap-theme.css" media="screen" />
<link rel="stylesheet" type="text/css" href="css/front/style.css" media="screen" />


<script src="js/jquery-1.11.1.js"></script>

<!--[if lte IE 9]>
<link rel="stylesheet" type="text/css" href="css/front/ie.css" target="_blank" rel="external nofollow"  media="screen" />//針對ie9以下浏覽器修改代碼
<script src="bootstrap-3.3.5-dist/js/respond.js"></script>
//Respond.js 是一個快速、輕量的 polyfill,用于為 IE6-8 以及其它不支援 CSS3 Media Queries 的浏覽器提供媒體查詢的 min-width 和 max-width 特性
<script src="bootstrap-3.3.5-dist/js/html5.js"></script>//,讓IE(包括IE6)支援HTML5元素
<script src="bootstrap-3.3.5-dist/js/css3-mediaqueries.js"></script>//解決IE8及低版本浏覽器不支援CSS3 
<![endif]-->
<!--bootstrap相容ie8,css3相容mediaqurey-->

<script src="bootstrap-3.3.5-dist/js/bootstrap.js"></script>
</head>
<body>
</body>
</html>
           

說明:

1.ie.css這是自己寫的

2.respond.js、html5.js、css3-mediaqueries.js可以百度到的。稍後我也會上傳到我的資源裡

繼續閱讀