<!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. 【弱省胡策】Round #5 Count

    [弱省胡策]Round #5 Count 太神仙了. \(DP\)做法 设\(f_{n,m,d,k}\)表示\(n*m\)的矩阵,填入第\(k\)个颜色,并且第\(k\)个颜色最少的一列上有\(d\) ...

  2. 5.05-requests_cookies2

    import requests # 请求数据url member_url = 'https://www.yaozh.com/member/' headers = { 'User-Agent': 'Mo ...

  3. AJAX问题 XMLHttpRequest.status = 0是什么含义

    在调用AJAX的时候遇到了XMLHttpRequest. status为0 的情况,http协议里可是没这个状态码的,众所周知,XMLHttpRequest. Status为HTTP请求状态码,一般为 ...

  4. python入门学习：2.列表简介

    python入门学习:2.列表简介 关键点:列表 2.1 列表是什么2.2 修改.添加和删除元素2.3 组织列表 2.1 列表是什么   列表,是由一系列按特定顺序排列的元素组成.你可以创建包含字母表 ...

  5. [转]Oracle 清除incident和trace -- ADRCI用法

    在oracle11g中,dump file的目录已经有所改变,bdump和udump整合到trace中,cdump独立出一个. E:\ora11g\app\Administrator\diag\rdb ...

  6. SQL优化工具SQLAdvisor使用

    一.简介在数据库运维过程中,优化SQL是业务团队与DBA团队的日常任务.例行SQL优化,不仅可以提升程序性能,还能够降低线上故障的概率. 目前常用的SQL优化方式包括但不限于:业务层优化.SQL逻辑优 ...

  7. rabbitmq官方的六种工作模式

    1.RabbitMq1.1介绍RabbitMQ是一个消息代理:它接受并转发消息.你可以把它当成一个邮局:当你想邮寄信件的时候,你会把信件放在投递箱中,并确信邮递员最终会将信件送到收件人的手里.在这个例 ...

  8. Js获取当前页面URL各种参数

    JS获取当前页面URL各种参数 一:Location Location 对象包含有关当前 URL 的信息. Location 对象是 Window 对象的一个部分,可通过 window.locatio ...

  9. Python 学习 第十五篇：模块搜索路径和包导入

    在导入自定义的模块时,除了指定模块名之外,也需要指定目录,由于Python把目录称作包,因此,这类导入被称为包导入.包导入把计算机上的目录变成Python的命名空间,而目录中所包含的子目录和模块文件则 ...

  10. React-菜鸟学习笔记（一）

    新公司的项目前端架构用的是react.js 之前孤陋寡闻并没听说过,想着后期开发和维护多少要会点前端的东西,就简单研究一下.个人的学习习惯能写代码的就不写文字,必要的地方加两行注释,代码一行行敲下去, ...