IE浏览器兼容性调整总结技巧
前言
最近项目做完，用户需要兼容IE，于是开展了兼容性的调整工作。边调整边想感叹IE真是个沙雕。。特将我遇到的问题记录下来，以及记录我的解决办法，以下问题及解决办法，都是真实可用的，本人亲测~~
一、IE浏览器下，没有达到出现滚动条的条件，但是出现了滚动块的问题
滚动块就是个灰色的方形，滚动条的两边。出现这种情况，一般是你的某个css文件，将哪个地方的overflow设置成了scroll，所以强行出现。改为overflow-y：auto即可。
二、IE浏览器下引入的样式不生效，其他浏览器正常
这个问题是因为IE浏览器对引入的资源做了限制。限制规则总结一下：
1、文档中只有前31个link或style标记关联的CSS能够应用。
三、强制ie以最新的版本模式对页面进行渲染
介绍一行代码
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
X-UA-Compatible是IE8的一个专有<meta>属性，它告诉IE8采用何种IE版本去渲染网页，在html的<head>标签中使用。
Edge 模式告诉 IE 以最高级模式渲染文档，也就是任何 IE 版本都以当前版本所支持的最高级标准模式渲染，避免版本升级造成的影响。
简单的说，就是什么版本 IE 就用什么版本的标准模式渲染。
chrome=1 这个并不是IE模拟chrome，而是谷歌自己做的一个外挂：Google Chrome Frame(谷歌内嵌浏览器框架GCF)。这个插件可以让用户的IE浏览器外不变，但用户在浏览网页时，实际上使用的是Google Chrome浏览器内核，而且支持IE6、7、8等多个版本的IE浏览器
要使用chrome=1，要安装GCF，并且指定页面使用chrome内核来渲染。
参考文章链接：
https://blog.csdn.net/MEdwardM/article/details/52984648
https://www.cnblogs.com/chendc/p/5423337.html
四、IE下get请求报错：java.lang.IllegalArgumentException: Invalid character found in the request target. The valid characters are defined in RFC 7230 and RFC 3986
五、IE下不设置背景颜色
六、IE下inout框中内容显示不全，点击时晃动
七、IE9不支持startwith与endswith函数
String.prototype.startWith = function(s) {
if (s == null || s == "" || this.length == 0 || s.length > this.length)
return false;
if (this.substr(0, s.length) == s)
return true;
else
return false;
return true;
}
String.prototype.endWith = function(s) {
if (s == null || s == "" || this.length == 0|| s.length > this.length)
return false;
if (this.substring(this.length - s.length) == s)
return true;
else
return false;
return true;
}
八、IE9不支持flex布局
现在使用flex布局较多。可以实现互相之间的宽度互补。但是IE并不支持。
于是两个div的情况下，使用display:inline-block与float配合使用。同时需要对宽度来进行定义。
IE浏览器兼容性调整总结技巧的更多相关文章
- sass进阶—mixin的使用（浏览器兼容性调整）
@mixin content($color:red,$fontSize:14px){ color:$color; font-size: $fontSize;} /*调用含参数的mixin,使用更加灵活 ...
- PC/H5端各浏览器兼容性问题及解决方案？
概念:所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码解析的差异,造成页面显示效果不统一的情况. 1>不同浏览器的标签默认的外补丁和内补丁不同问题症状:随便写几个标签,不加样式控制的情况 ...
- web前端开发浏览器兼容性 - 持续更新
浏览器兼容性问题又被称为网页或网站兼容性问题:不同浏览器内核及所支持的html等网页语言标准不同,不同客户端环境(如分辨率不同)造成实际显示效果未能达到预期理想效果 首先我们来看一下目前市面上常见的一 ...
- 浏览器兼容性之Css篇
本文与上一篇随笔<浏览器兼容性之Javascript篇>有一定关联,下来我会继续不断总结,旨在解决浏览器兼容性,对遇到类似问题的同仁有所帮助,如有更多解决浏览器兼容性的案例还望大家分享一起 ...
- 【转】CSS浏览器兼容性与解析问题终极归纳
1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...
- 【web前端开发】浏览器兼容性处理
1.居中问题div里的内容,IE默认为居中,而FF默认为左对齐,可以尝试增加代码margin: 0 auto;2.高度问题两上下排列或嵌套的div,上面的div设置高度(height),如果div里的 ...
- jQuery1.11源码分析(3)-----Sizzle源码中的浏览器兼容性检测和处理[原创]
上一章讲了正则表达式,这一章继续我们的前菜,浏览器兼容性处理. 先介绍一个简单的沙盒测试函数. /** * Support testing using an element * @param {Fun ...
- HTML`CSS_网站页面不同浏览器兼容性问题解决
目前,最为流行的浏览器共有五个:分别是ie,Edge浏览器(属于微软),火狐,谷歌(chrome)Safari和Opera五大浏览器. Trident内核:IE ,360,,猎豹,百度: Gecko内 ...
- 浏览器兼容性-JS篇
总结一下平时遇到的浏览器兼容性问题,本篇关于JS. 1.事件绑定 兼容写法: function add(obj,event){ if (obj.addEventListener) { obj.addE ...
随机推荐
- MySql的创建时间和修改时间
在创建时间字段的时候 DEFAULT CURRENT_TIMESTAMP表示当插入数据的时候,该字段默认值为当前时间 ON UPDATE CURRENT_TIMESTAMP表示每次更新这条数据的时 ...
- [CF960G] Bandit Blues
题意 给你三个正整数 \(n,a,b\),定义 \(A\) 为一个排列中是前缀最大值的数的个数,定义 \(B\) 为一个排列中是后缀最大值的数的个数,求长度为 \(n\) 的排列中满足 \(A = a ...
- Perl分片技术
分片(slice) 在perl中,如果想要取得一部分变量.一部分列表内容.一部分hash内容,可以采用分片(切片)的方式. 注意,perl并未提供字符串的切片方式,但可以使用内置函数substr()来 ...
- 第一册：lesson thirty one。
原文:Where is Sally? A:Where is .. B? B:She is in the garden,A. A:What's she doing? B:She is sitting u ...
- WPF TextBlock IsTextTrimmed 判断文本是否超出
WPF TextBlock/TextBox 设置TextTrimming情况下 判断 isTextTrimmed(Text 文本是否超出 是否出现了省略号) private bool IsTextTr ...
- 从零开始学安全(二十三)●用PHP编写留言板
<?php include("test.php"); ?> <!DOCTYPE html> <html> <head> <me ...
- vue IE 报错 引用babel-polyfill
一.vue 项目报错 vuex requires a Promise polyfill in this browser 在网上找到下面三篇文章,然而和我的项目都不太一样. 我的项目基于 基础模 ...
- 【微服务No.3】AOP组件ASPectCore简单使用
介绍: AspectCore是.NET标准的基于AOP的跨平台框架[github解释].主要支持:对方面拦截器,依赖注入集成,Web应用程序,数据验证等的核心支持. 使用实例: 首先安装dll: In ...
- 百度前端学院-基础学院-第七天到第八天之BFC
1.BFC简介 BFC全称"block formatting context",中文为“块级格式化上下文”.特征总之记住一句话: BFC元素特征表现原则就是:内部元素无论怎么翻江倒 ...
- 四个O(n^2)级别的排序性能测试
测试环境为DEV-C++,并且选择排序,插入排序,冒泡排序,均为优化后的,若想了解具体优化过程,请参照:https://blog.csdn.net/qq_40164152 测试用例: #ifndef ...