这种响应式的布局正是通过CSS3的媒体查询(Media Query)功能实现的,根据不同的分辨率来匹配不同的样式。IE8浏览器并不支持这一优秀的Css3特性,Bootstrap在开发文档中写了如何使用进行兼容IE8,如果想兼容IE6,IE7,可以搜索bsie (bootstrap2)。

http://v2.bootcss.com

1,注意,使用bootstrap最好使用2.0以下的jquery;

2,ie8以下不支持placeholder

<script type="text/javascript" src="js/bootstrap/jquery.placeholder.js"></script>
<script type="text/javascript">
$(function () {
$('input, textarea').placeholder();
});
</script>

总结:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
<meta name="author" content="zhy" />
<title>ie8</title>
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
<!--[if lte IE 9]>
<script src=js/bootstrap/respond.min.js"></script>
<script src=js/bootstrap/html5shiv.min.js"></script>
<![endif]-->
<script src="js/bootstrap/jquery-1.12.0.min.js"></script>
<script src="js/bootstrap/bootstrap.min.js"></script>
</head>
<body>
</body>
</html>

IE判断IE版本的语句:

<!--[if lte IE 6]>
<![endif]-->
IE6及其以下版本可见 <!--[if lte IE 7]>
<![endif]-->
IE7及其以下版本可见 <!--[if IE 6]>
<![endif]-->
只有IE6版本可见 <![if !IE]>
<![endif]>
除了IE以外的版本 <!--[if lt IE 8]>
<![endif]-->
IE8以下的版本可见 <!--[if gte IE 7]>
<![endif]-->
IE7及大于IE7的版本可见

lte:就是Less than or equal to的简写,也就是小于或等于的意思。 
lt : 就是Less than的简写,也就是小于的意思。 
gte: 就是Greater than or equal to的简写,也就是大于或等于的意思。 
gt : 就是Greater than的简写,也就是大于的意思。 
! :  就是不等于的意思,跟javascript里的不等于判断符相同

bootstrap兼容IE的更多相关文章

  1. 解决easyui和bootstrap兼容问题

    在使用bootstrap和easyui的时候,发现很多有冲突的地方,包括datagrid控件和combo等,以下进行的问题修正,保证easyui正常显示 /*bootstrap兼容问题和easyui的 ...

  2. bootstrap 兼容 IE8

    在 html 中引用 <!-- bootstrap 兼容 IE8 --> <script src="../../jsapi/js/html5shiv.min.js" ...

  3. Bootstrap兼容

    转:http://blog.csdn.net/chenhongwu666/article/details/41513901 如有雷同,不胜荣幸,若转载,请注明让IE6 IE7 IE8 IE9 IE10 ...

  4. bootstrap兼容IE8的一些注意

    准备 bootstrap 3.3.5 jQuery 1.12.0 注意 支持html5 需要引入html5.js 支持placeholder 需要引入placeholder.js ie8 不支持 fo ...

  5. Bootstrap兼容IE8

    使用BootStrap3.x写的公司一个响应式项目在IE下面错误百出,经过一番折腾.全部解决了IE8下的兼容问题. 这里汇总一下,希望对大家有所帮助. 1. Bootstrap UI整体在IE8下变窄 ...

  6. bootstrap兼容IE8 解决办法

    bootstrap有使用CSS3,所以ie9以下浏览器不会很顺畅.IE9以下的兼容性不是很好.IE本身就是怪胎,就搞一些和外界标准不一致.搞得web开发考虑这考虑那的兼容性,蛋疼! 基本上css3的没 ...

  7. bootstrap 兼容哪些浏览器

    Bootstrap的目标是在最新的桌面和移动浏览器上有最佳的表现,也就是说,在较老旧的浏览器上可能会导致某些组件表现出的样式有些不同,但是功能是完整的.bootstrap3支持的浏览器: Chrome ...

  8. bootstrap 兼容IE8设置

    <!--[if lt IE 9]> <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js" ...

  9. Bootstrap兼容处理

    接将一下代码引用到页面 </body> 之前 <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js" ...

随机推荐

  1. bzoj 2816: [ZJOI2012]网络(splay)

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2816 [题意] 给定一个无向图,满足条件:从一个节点出发的同色边不超过2条,且不存在同 ...

  2. 【po3693】Maximum repetition substring

    题意: 给定一个字符串 求重复次数最多的连续重复子串 并输出字典序最小方案 题解: 枚举子串长度L 显然如果重复次数>1 那么答案串肯定包含s[1],s[1+L],s[1+L*2],...中的两 ...

  3. HUOJ-10857 最大的面积 凸包+DP

    题目链接:http://acm.hunnu.edu.cn/online/?action=problem&type=show&id=10857&courseid=55 比赛的时候 ...

  4. java 通过网络 ntp 获取网络时间

    需要 commons-net-3.4.jar 库. import org.apache.commons.net.ntp.NTPUDPClient; import org.apache.commons. ...

  5. phonegap Overview

    PhoneGap 和 Cordova的关系阐述 是PhoneGap贡献给Apache后的开源项目,是从PhoneGap中抽出的核心代码,是驱动PhoneGap的核心引擎.你可以把他想象成类似于Webk ...

  6. mssql函数demo

    ALTER FUNCTION [dbo].[f_GetCookType] (@saleDate datetime)RETURNS varchar(6)ASBEGIN declare @cookType ...

  7. CentOS 下SSH无密码登录的配置

    CentOS 下SSH无密码登录的配置 最近学习Hadoop.它要求各节点之间通过SSH无密码登录,配置SSH的时候费了一番功夫,记录下来,以备忘. 配置SSH无密码登录需要3步: 1.生成公钥和私钥 ...

  8. cocos2d-x Sprite

    转自:http://codingnow.cn/cocos2d-x/795.html 精灵是游戏中十分重要的组成部分,随处可见,如:游戏背景.NPC.人物.道具等.在cocos2d-x引擎中,只要是用图 ...

  9. Matplotlib 工具包 使用教程索引

    官方文档链接中: http://matplotlib.org/gallery.html 这里给了非常多演示样例图片.能够查看对应源码,是一个非常好学习途径. matplotlib 函数API :函数A ...

  10. Android TabHost TabWidget 去除黑线(底部下划线)

    采用TabHost布局时,往往会发现默认的系统风格与软件风格很不协调,比如TabWidget的下划线影响布局效果.通常情况下会去除其下划线.如果是采用xml布局文件,在TabWidget的属性项设置a ...