编程 Javascript

bootstrap IE8 兼容性处理

Posted in Javascript onMarch 22, 2017

bootstrap IE8 兼容性处理

<!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">
    <title>Bootstrap IE8兼容性</title>
    <link href="css/bootstrap.min.css" rel="external nofollow" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" rel="external nofollow" />
    
    <!--[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>
    <div class="container">
      <div class="row">
        <div class="col-sm-6" style="border: 1px solid red;">
          左侧
        </div>
        <div class="col-sm-6" style="border: 1px solid green;">
          右侧
        </div>
      </div>
    </div>
  </body>

</html>

针对 IE8 仍然需要额外引入 Respond.js 文件以支持媒体查询（media query）。

1、http协议下效果（如：http://192.168.12.40:8020/bootstrap/index.html）：

bootstrap IE8 兼容性处理

2、file文件协议IE8下效果（如：C:\Users\dell\Documents\HBuilderProject\bootstrap\index.html）

bootstrap IE8 兼容性处理

如上图所示，已经不支持栅格布局。

主要存在的问题是：

Respond.js 与 file:// 协议

由于浏览器的安全机制，Respond.js 不能在通过 file:// 协议（打开本地HTML文件所用的协议）访问的页面上发挥正常的功能。如果需要测试 IE8 下面的响应式特性，务必通过 http 协议访问页面（例如搭建 apache、nginx 等）。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持三水点靠木。

bootstrap IE8 兼容性处理

- Author -

lijiao

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JSON 学习之完全手册图文

May 29 Javascript

JavaScript 验证浏览器是否支持javascript的方法小结

May 17 Javascript

jQuery使用$.ajax进行异步刷新的方法(附demo下载)

Dec 04 Javascript

JSON字符串转换JSONObject和JSONArray的方法

Jun 03 Javascript

自己封装的一个简单的倒计时功能实例

Nov 23 Javascript

JS传播事件、取消事件默认行为、阻止事件传播详解

Aug 14 Javascript

react-native使用react-navigation进行页面跳转导航的示例

Sep 07 Javascript

在react-router4中进行代码拆分的方法（基于webpack）

Mar 08 Javascript

如何用RxJS实现Redux Form

Dec 29 Javascript

vue 实现滚动到底部翻页效果(pc端)

Jul 31 Javascript

vue路由跳转传递参数的方式总结

May 10 Javascript

一小时迅速入门Mybatis之bind与多数据源支持 Java API

Sep 15 Javascript

详解angular中通过$location获取路径(参数)的写法

Mar 21 #Javascript

jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码

Mar 21 #jQuery

Linux使用Node.js建立访问静态网页的服务实例详解

Mar 21 #Javascript

在 Angular 中实现搜索关键字高亮示例

Mar 21 #Javascript

js省市区级联查询（插件版&无插件版）

Mar 21 #Javascript

Bootstrap学习笔记轮播（Carousel）插件

Mar 21 #Javascript

详解Vue2+Echarts实现多种图表数据可视化Dashboard（附源码）

Mar 21 #Javascript

You might like

多人战的战术与战略

2020/03/04 星际争霸

当年上海收录机产品生产,进口和价格情况

2021/03/04 无线电

FCKeditor添加自定义按钮

2008/03/27 PHP

基于swoole实现多人聊天室

2018/06/14 PHP

PHP下载大文件失败并限制下载速度的实例代码

2019/05/10 PHP

input+select(multiple) 实现下拉框输入值

2009/05/21 Javascript

遨游，飞飞，IE，空中网浏览器无提示关闭方法

2011/07/11 Javascript

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一

2011/12/31 Javascript

js arguments对象应用介绍

2012/11/28 Javascript

基于jquery实现的省市区级联无ajax

2013/09/24 Javascript

两款JS脚本判断手机浏览器类型跳转WAP手机网站

2015/10/16 Javascript

纯js三维数组实现三级联动效果

2017/02/07 Javascript

form表单数据封装成json格式并提交给服务器的实现方法

2017/12/14 Javascript

详解React中传入组件的props改变时更新组件的几种实现方法

2018/09/13 Javascript

element-ui多文件上传的实现示例

2019/04/10 Javascript

JavaScript实现随机点名器实例详解

2019/05/07 Javascript

微信小程序实现音频文件播放进度的实例代码

2020/03/02 Javascript

vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】

2020/06/01 Javascript

Python中实现从目录中过滤出指定文件类型的文件

2015/02/02 Python

python实现自动更换ip的方法

2015/05/05 Python

Python中列表和元组的使用方法和区别详解

2020/12/30 Python

Python正则表达式完全指南

2017/05/25 Python

python基于twisted框架编写简单聊天室

2018/01/02 Python

django的403/404/500错误自定义页面的配置方式

2020/05/21 Python

Python批量删除mysql中千万级大量数据的脚本分享

2020/12/03 Python

CSS3 实现的加载动画

2020/12/07 HTML / CSS

Booking.com美国：全球酒店预订网站

2017/04/18 全球购物

汉米尔顿手表官网：Hamilton

2020/09/13 全球购物

Java语言程序设计测试题判断题部分

2013/01/06 面试题

四好少年事迹材料

2014/01/12 职场文书

市场部经理岗位职责

2014/04/10 职场文书

护理专科学生自荐书

2014/07/05 职场文书

沙滩主题婚礼活动策划方案

2014/09/15 职场文书

教师作风建设剖析材料

2014/10/11 职场文书

离职感谢信

2015/01/21 职场文书

Linux在两个服务器直接传文件的操作方法

2022/08/05 Servers