关于bootstrap IE8的兼容性问题

非常久没有写技术类的文章了.这几天在用bootstrap来做我们站点的UI框架,感觉还是不错的.只是遇到一点不大不小的问题,那就是有朋友在IE8下訪问我们的站点.界面变成了跟手机浏览一样的界面. 后来查了一下,原来bootstrap下对IE8及下面的iE浏览器都会有问题,百度了一下.得知了一些解决方法,大概就是用respond.js来解决,只是试了好几次都没有解决.后来就把getbootstrap.com/站点的首页源代码复制下来,看到他们的页面在IE8下是正常的.他们是採取了这种解决的方法:…

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-wid…

IE8的兼容性问题

IE的兼容性问题是前端开发人员的老大难问题,不过随着时代的发展,IE6逐渐的被淘汰,现在以及很少有网站兼容IE6了,一般都兼容到IE8,现在我总结了一些IE8的兼容性问题及解决方法. 1.使用meta标签调节浏览器的渲染方式 IE8中有一个"兼容性视图"的概念,当初IE8发布时,相对于IE6/7已经做出了非常大的改进,但是很多老站点仅针对IE6/7进行了优化,使用IE8渲染反而会一团糟.为了照顾这些苦逼的前端工程师,IE8加入了"兼容性视图"功能,这样的话就可以在I…

bootstrap IE8 相互兼容

针对 IE8 仍然需要额外引入 Respond.js 文件(由于仍然利用了浏览器对媒体查询(media query)的支持,因此还需要做处理) <html lang="zh-cn"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name=&…

flask bootstrap IE11的兼容性问题

在子模板内添加如下代码确保IE11的兼容性问题. {% extends 'bootstrap/base.html' %}{% block metas %} <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=edge" />…

【原创】最有效解决IE8 position兼容性问题

看了网上的的帖子真是水的一塌糊涂,完全没有解决我和广大网友们的关于ie8下position兼容性问题. 网上有的技术我就不说了 ,大家自行搜索,我想说的重点是 ie8不支持html5的新标签.这是重点.因此有的童鞋怎么搜索网上再怎么实现也不会成功解决这个问题. 就比如html5的<header></header>标签. 现在解决办法有两种: 一.你将那些新标签全改成div(费事费时,还得从新规划css样式 ) 推荐: 二.用js代码让ie8可以识别那些新标签. 详解+步骤: 1.在…

关于IE8的兼容性问题

DOCTYPE 首先需要确保你的HTML页面开始部分要有DOCTYPE声明.DOCTYPE告诉浏览器使用什么样的HTML或XHTML规范来解析HTML文档,具体会影响: 对标记.attributes .properties的约束规则对浏览器的渲染模式产生影响,不同的渲染模式会影响到浏览器对于CSS 代码甚至 JavaScript 脚本的解析DOCTYPE是非常关键的,目前的最佳实践就是在HTML文档的首行键入: 对于DOCTYPE的具体阐述就不展开了,可以参考:<正确使用DOCTYPE>.&l…

IE8浏览器兼容性问题

IE8存在的问题1.不支持forEach循环,建议用原生2.不建议jQuery9(ajax存在部分问题),建议用jQuery8/73.不支持伪类元素4.颜色,不完全支持RGBA(33, 132, 255, 1),建议使用#2184ff这种5.不支持圆角border-radius,需要使用css3pie6.不支持input标签的placeholder属性,可能需要jquery解决7.IE8的input文本不居中,需要使用line-height: 40px;属性…

placeholder在IE8中兼容性问题解决

placeholder是HTML5中的一个属性,可以在文本框中设置placeholder属性来显示一些提示性的文字,但对IE10以下的浏览器不支持,下面方法可以让placeholder能够使用在IE10以下的版本中. 第一种方法是在页面中添加下面一段脚本: <script type="text/javascript"> if( !('placeholder' in document.createElement('input')) ){ $('input[placeholde…

浅谈如何让 Bootstrap 3兼容IE8浏览器

Bootstrap 是最受欢迎的 HTML.CSS 和 JS 框架,用于开发响应式布局.移动设备优先的 WEB 项目.-- Bootstrap 官网 Bootstrap 来自 Twitter,是目前最受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JavaScript的,它简洁灵活.开发过程中,我们只需通过给DOM元素添加相应的class即可调用,使得 Web 开发更加快捷. 接下来进入主题,谈谈 Bootstrap 3 浏览器兼容性问题及其对应的解决方案: 1.移动设备支持情况…

Bootstrap 4/3 页面基础模板与兼容旧版本浏览器

Bootstrap 3 与 4 差别很大,目录文件结构.所引入的内容也不同,这里说说一下 Bootstrap 引入的文件.网页模板和兼容性问题.本网站刚刚搭建好,正好发一下文章原来测试网站. Bootstrap 4 目录结构如下 bootstrap/ ├── css/ │ ├── bootstrap.css │ ├── bootstrap.css.map │ ├── bootstrap.min.css │ ├── bootstrap.min.css.map │ ├── bootstrap-gri…

Web前端兼容性指南

一.Web前端兼容性问题一直以来,Web前端领域最大的问题就是兼容性问题,没有之一. 前端兼容性问题分三类: 浏览器兼容性屏幕分辨率兼容性跨平台兼容性 1.浏览器兼容性问题第一次浏览器大战发生在上个世纪90年代,微软发布了IE浏览器,和网景公司的Netscape Navigator大打出手,1998年网景不得不将公司卖给AOL.没有了对手的IE不思进取,W3C标准支持发展缓慢,为以后的IE兼容性灾难埋下了伏笔.到2004年,IE的市场份额达到95%,但在此之后IE的份额逐步遭其他浏览器蚕…

Bootstrap 3 -> 4 : 居中布局的变化

我们知道,Bootstrap布局的核心是栅格系统,一行有12个栅格. 比如,我想让两个宽度400px左右的div居中显示. 这个时候,我们可以利用栅格的列偏移功能. <div class="row"> <div class="col-md-4 col-md-offset-2">.col-md-4</div> <div class="col-md-4">.col-md-4</div> &l…

IE关闭兼容性视图

不知道什么时候,ie8的“兼容性视图设置”变成了灰色,如图: 今天通过设置组策略,终以解决了这个问题: ie8的兼容性视图设置灰色的解决办法:运行gpedit.msc--用户配置/计算机配置--管理模板--windows组件--Internet Explorer--兼容性视图--全部设置为:未配置,问题解决了…

用反向代理nginx proxy_pass配置解决ie8 ajax请求被拦截问题 ie8用nginx代理实现跨域请求访问 nginx405正向代理request_uri

最近调PC版网站ie8的兼容性,发现所有ajax请求还没到后端服务器就直接ajax error了 ie8发不出ajax请求,断点调试发现ajax全进入了error,提示“No transport” 我是访问本机网站项目,所以配的是localhost,ie8不能像chrome浏览器通过启动命令开启跨域限制,所以用nginx对ajax请求做proxy_pass中转了具体配置如下: server { listen 80; #listen 8787; server_name localhost; #c…

IE8 margin:0 auto 不能居中显示的问题

ie8下面margin:0 auto;不能居中的解决方案,ie8兼容性代码今天写了个div,用margin:0 auto:来定义他的属性,让他居中,结果,竟然无效. 一开始以为是css里的代码冲突了,检查了好几遍,没问题,然后用火狐和谷歌浏览器测试,居中了... 看来是浏览器兼容性的问题,突然想起现在用了win7,ie已经升级到了ie8,看来问题就处在ie8的兼容性上.百度之.... 特将解决方法复制到下面: IE6,7,Firefox下实现居中一般用:margin: auto 来实现,但在I…

IE8 下面通过滤镜的方式进行图片旋转

首先,为什么我会提出这样的方式来进行操作呢?原因还是需求导致: 在做项目中,有这样一个需求,在进行网页中图片查看的时候,需要对图片的操作有支持旋转和缩放这些操作,看似这样的网上插件有很多,对!但是对于IE8 的支持都不行啊~~~因为虽然很多插件可以在 IE8进行图片旋转,比如jquery的rotate.js 插件很好用,但是在IE8 下面进行旋转之后,就不能在进行缩放了,因为它会自动生成一个固定大小的object 元素,我们就不能操作这个元素了!要不就是使用canvas, 但是我的需求是在旋转…

[兼容]——IE 8 常见兼容性问题

接触了一个PC端网页开发的项目,要求兼容到IE 8,遇到不少坑,在这里记录下: 1.IE8 的兼容性视图 bug描述:IE8有许多新更新,但微软为了兼容以前的IE浏览器,提出了"兼容性视图"的概念,它可以使用低版本IE(6.7)内核,显然这并不是我们想要的,所以需要使用meta标签来强制IE8使用最新的内核渲染页面 bug解决: <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1&…

ie8下修改input的type属性报错

摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做试验,测试结果是chrome,Firefox,ie9+都是好的,在ie8以下就会报错,查找了下原因,ie8中是不允许修改input的type属性,最终换了种思路实现. 当勾选显示明文时替换输入框为type="text",不勾选时在将输入框替换为type="password&quo…

关于【IE兼容】的都在这

滚动条 ie的滚动条覆盖了内容,为了触屏操作优化浏览器的内容显示,IE 浏览器提供了一种可以浮动显示,自动隐藏的滚动条样式,但是这个样式会在某些情况下造成一些困扰,比如下图... 其实默认情况下,桌面版的 IE 应该是传统的滚动条样式:而在应用版的 IE 中,滚动条默认才是浮动显示,自动隐藏. 但是可能会发现,一些使用了 bootstrap 样式的网站,也会出现相同这种情况,后来了解了下是因为bootstrap设置了一个属性 @-ms-viewport { width: device-width…

【持续更新】JavaScript常见面试题整理

[重点提前说]这篇博客里的问题涉及到了了JS中常见的的基础知识点,也是面试中常见的一些问题,建议初入职场的园友Mark收藏,本文会持续更新~ 1. 引入JS的三种方式 1.在HTML标签中直接使用,直接内嵌JS(但是不提倡使用): >>>不符合W3C关于内容和行为分离的要求: 2.在HTML页面中使用<scrip> </script>标签包裹JS代码: >>>script标签可以放到页面的各种位置: 3.引入外部的JS文件使用<script…

第一章 jQuery基础

第一章jQuery基础一.jQuert简介 1.什么是jQuery jQuery是javaScript的程序库之一,它是javaScript对象和实用函数的封装. jQuery是继Prototype之后又一个优秀的javaScript库,是由美国人 Johh Resig于2006年创建的开源项目. jQuery只是javaScript的程序库,只相当于它的一个子集,并不能完全取代javaScript. 2.为什么要使用jQuery 与javaScript相比,使用jQuery制作交互特效的语…

JQuery制作网页——第五章初识 jQuery

1.jQuery简介: ● jQuery由美国人John Resig于2006年创建 ● jQuery是目前最流行的JavaScript程序库,它是对JavaScript对象和函数的封装 ● 它的设计思想是write less,do more(以更少的代码,实现更多的功能): ●jQuery是javaScript的程序库之一,它是javaScript对象和实用函数的封装. ●jQuery是继Prototype之后又一个优秀的…

第一章jQuery基础

一.jQuert简介 1.什么是jQuery jQuery是javaScript的程序库之一,它是javaScript对象和实用函数的封装. jQuery是继Prototype之后又一个优秀的javaScript库,是由美国人 Johh Resig于2006年创建的开源项目. jQuery只是javaScript的程序库,只相当于它的一个子集,并不能完全取代javaScript. 2.为什么要使用jQuery 与javaScript相比,使用jQuery制作交互特效的语法更为简单,代码量大大减…

B2B商城网站前端开发

最近在时间很忙,在弄一个B2B商城,运用到的easyUI+javaWEB(maven)+JQuery+Scss+JavaScript+其他框架(sea.js模块化等),我负责前端这块:后期的重要的前端代码,都会发布出来 1.60s短信验证码发送code: //60s无效 forget 要引用的话,后期如果,jquey代码庞大的话,就考虑在封装的基础上,在进行封装.压缩精简代码. $('.forget span.btn-small').on('click',function(){ !$(this)…

ng-repeat && ng-options的故事

ng-repeat && ng-options的故事 1. <select class="input-small" ng-model="newHost.os" style="width:102px;" ng-show="osType==2"> <option ng-repeat="item in osList.Linu…

Jquery中css()方法获取边框长度

1. JQuery中可以使用css()方法获取块元素的边框宽度,如下: $("divMode").css("border-left-width");//左边框长度 “8px”(字符型) $("divMode").css("border-right-width");//右边框长度 “8px”(字符型) 2. 上面的获取方式,取到的只是字符串格式的:如果要运用到计算中,需要使用praseInt()将获取的值转换.如下: var b…

JavaScript Table行定位效果

作者:cloudgamer 时间: 2009-09-17 文档类型:原创来自:蓝色理想第 1 页 JavaScript Table行定位效果 [1] 第 2 页 JavaScript Table行定位效果 [2] 第 3 页 JavaScript Table行定位效果 [3] 第 4 页 JavaScript Table行定位效果 [4] 第 5 页 JavaScript Table行定位效果 [5] 第 6 页 JavaScript Table行定位效果 [6] 第 7 页 JavaScr…

CSS hack常用方案（摘选）

邮箱因为默认了line-height?:170%,导致采用table元素时继承问题,可以采用line-height:50% 很好解决. 常在使用float时,后面的显示不正常,因为继承了float了,可以采用clear来实现正常,当采用了display:inline-block实现块与块之间连接后,由于ie6不正常,可以采用margin移动到目标实现,很多时候,input,hx,p在浏览器中总是不在正中间可以采用line- height高度和height高度一致实现.实现居中最常用的方法就是…

从web图片裁剪出发：了解H5中的Blob

刚开始做前端的时候,有个功能卡住我了,就是裁剪并上传头像.当时两个方案摆在我面前,一个是flash,我不会.另一个是通过iframe上传图片,然后再上传坐标由后端裁剪,而我最终的选择是后者.有人会疑惑,为什么不用H5的Canvas和FormData,第一要考虑ie8的兼容性,第二那时候眼界没到,这种新东西光是听听都怕. 后来随着Mobile项目越做越多,类似的功能开发得也越来越多,Canvas+FormData成为了标配方案.但做的多了却一直没有静下心来研究,浏览器怎么使用H5的方式裁剪并把文件…

【关于bootstrap IE8的兼容性问题】的更多相关文章