<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>bootstrap3兼容</title>

    <link rel="stylesheet" href="css/bootstrap.min.css">

    <script src="js/respond.min.js"></script>

    <script src="js/html5shiv.min.js"></script>

</head>

<body>

<div class="row" >

    <div class="col-xs-6 col-sm-3"

         style="background-color: #dedef8;

         box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>

    </div>

    <div class="col-xs-6 col-sm-3"

         style="background-color: #dedef8;box-shadow:

         inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do

            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut

            enim ad minim veniam, quis nostrud exercitation ullamco laboris

            nisi ut aliquip ex ea commodo consequat.

        </p>

        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do

            eiusmod tempor incididunt ut.

        </p>

    </div>

    <div class="clearfix visible-xs"></div>

    <div class="col-xs-6 col-sm-3"

         style="background-color: #dedef8;

         box-shadow:inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

        <p>Ut enim ad minim veniam, quis nostrud exercitation ullamco

            laboris nisi ut aliquip ex ea commodo consequat.

        </p>

    </div>

    <div class="col-xs-6 col-sm-3"

         style="background-color: #dedef8;box-shadow:

         inset 1px -1px 1px #444, inset -1px 1px 1px #444;">

        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do

            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut

            enim ad minim

        </p>

    </div>

</div>

</body>

</html>

在引入bootstrap.min.css文件后引入一下两个文件：

<script src="js/respond.min.js"></script>

<script src="js/html5shiv.min.js"></script>
respond.min：让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。
html5shiv：解决ie9以下浏览器对html5新增标签的不识别，并导致CSS不起作用的问题。

由于浏览器的安全机制，Respond.min.js不能直接在本地访问的页面上发挥正常的功能，如果需要测试ie8响应式特性，必须通过http协议访问页面。

bootstrap3兼容IE8的更多相关文章

  1. bootstrap3兼容ie8浏览器

    bootstrap3 兼容IE8浏览器 2016-01-22 14:01 442人阅读 评论(0) 收藏 举报  分类: html5(18)    目录(?)[+]   近期在使用bootstrap这 ...

  2. bootstrap3 兼容IE8浏览器

    近期在使用bootstrap这个优秀的前端框架,这个框架非常强大,框架里面有下拉菜单.按钮组.按钮下拉菜单.导航.导航条.面包屑.分页.排版.缩略图.警告对话框.进度条.媒体对象等,bootstrap ...

  3. bootstrap3在IE8下导航不显示,自动识别成手机模式

    想让bootstrap3兼容ie8,需要将html5shiv.js.respond.js还有bootstrap的所有css.js文件都放在本地服务器空间,不能用CDN. bootstrap所有css. ...

  4. 【转】让Bootstrap 3兼容IE8浏览器

    FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...

  5. 让Bootstrap 3兼容IE8浏览器

    最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮 ...

  6. Bootstrap 3兼容IE8浏览器（转）

    Bootstrap是一个响应式的布局,你可以在宽屏电脑.普通电脑,平板电脑,手机上都得到非常优秀的布局体验.这种响应式的布局正是通过CSS3的媒体查询(Media Query)功能实现的,根据不同的分 ...

  7. Bootstrap 3 兼容 IE8 浏览器

    公司新上的项目,前端用的Bootstrap3的框架,但它已经放弃对IE9下的支持了.可IE8还是有着许多用户,不能不照顾到他们,IE7以下的,我只想说,现在什么年代了,要解放思想,与时俱进啊,就不能动 ...

  8. 兼容IE8以下浏览器input表单属性placeholder不能智能提示功能

    当前很多表单提示使用了表单属性placeholder,可这属性不兼容IE8以下的浏览器,我自己写了一个兼容处理js // 兼容IE8以下浏览器input不能智能提示功能 if(navigator.ap ...

  9. 如何使用videojs兼容IE8浏览器

    需要在服务器下运行 首先我们需要下载videojs包 https://github.com/videojs/video.js/releases 这里简单写了一个小栗子 <!DOCTYPE htm ...

随机推荐

  1. maven tomcat jstl 异常

    在跑一个带jstl的例子的时候,遇到了这样一个错误: org.springframework.web.util.NestedServletException: Handler processing f ...

  2. 【angularjs】使用angular搭建项目，pc端实现网页中的内容不可复制

    实现目标:不可复制页面内容 js: <script language="javascript"> if (typeof(document.onselectstart) ...

  3. 定义静态map

    public final static Map<String, String> header = new HashMap<String, String>(); static { ...

  4. emqtt在centos6下的安装

    1 emqtt下载地址 http://www.emqtt.com/downloads 右键 复制链接 http://www.emqtt.com/downloads/3011/centos6 2 打开服 ...

  5. buildroot使用介绍

    buildroot是Linux平台上一个构建嵌入式Linux系统的框架.整个Buildroot是由Makefile脚本和Kconfig配置文件构成的.你可以和编译Linux内核一样,通过buildro ...

  6. Attribute "resultType" must be declared for element type "insert"或"update"

    Attribute "resultType" must be declared for element type "insert"或"update&q ...

  7. 深入浅出Redis05-Redis集群环境的配置

    一.安装redis 1,下载redis最新版 从以下redis地址下载最新版本的redis,使用使用redis-3.2.9.tar版本. http://download.redis.io/releas ...

  8. Java网络编程中异步编程的理解

    目录 前言 一.异步,同步,阻塞和非阻塞的理解 二.异步编程从用户层面和框架层面不同角度的理解 用户角度的理解 框架角度的理解 三.为什么使用异步 四.理解这些能在实际中的应用 六.困惑 参考文章 前 ...

  9. 2018年12月份GitHub上最热门的Java开源项目

    来自:开源最前线(ID:OpenSourceTop) 链接:https://www.itcodemonkey.com/article/12747.html 又到了公布 GitHub 上热门项目的时候啦 ...

  10. Jmeter(三十七)循环控制器+交替控制器+事务控制器 完美实现接口字段参数化校验

    我们在做接口自动化的时候,常常因为无法灵活的的校验接口字段而烦恼.不能自动校验接口字段的脚本,也就不能称之为接口自动化.因此,我设计了一套组合式的控制器,可以完美的解决这个问题 1:首先我们需要在本地 ...