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 ...
随机推荐
- LearnOpenGL学习笔记(五)——纹理
在设计物体表面时,很多时候我们不满足于一种颜色或者几种简单颜色,我们希望是丰富多彩的图案,或者说我们提供给它的图片.这样一个顶点一个顶点的去指定那是行不通了,我们不可能把所有顶点用数字去表达出来,必须 ...
- 【整理】WDK 和 DDK异同
WDK和DDK的作用 开发WINDOWS下的驱动程序,需要一个专门的开发包,如:开发JAVA程序,我们可能需要一个JDK,开发 WINDOWS应用程序,我们需要WINDOWS的SDK,现在开发WIND ...
- Mybatis学习(一)—————mybatis入门
学习了hibernate这个持久层框架之后,在来学习Mybatis简直是无压力,因为Mybatis入门门栏很低,如果学习过了hibernate的话,对于Mybatis的学习很简单了,如果没学习过hib ...
- Perl:写POD文档
官方手册:https://perldoc.perl.org/perlpod.html POD文档是perl的man文档,可以用perldoc输出,也可以直接用man输出.在开始下面的文章之前,请先粗略 ...
- 【转】JS正则表达式大全(整理详细且实用)
正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个 ...
- C# 动态代码生成控件后其他事件不能获取该控件的值
1.新建web项目,添加两个Button控件,结果如图. 2.Button按钮控件点击事件代码如下 protectedvoid Button1_Click(object sender, EventAr ...
- Web下的HTTPS应用
---------------------------------------------------------------------------------------------------- ...
- RNN-LSTM入门
RNN-LSTM入门 Last Edited: Dec 02, 2018 10:20 PM Tags: 机器学习,论文阅读 RNN-Recurrent Neural Network 概念: 序列数据: ...
- docker相关操作文章整理
docker整理: 菜鸟教程的nginx操作链接(docker安装完毕安装nginx启动错误,可以看下面的文章) CSDN基于 Docker 安装 Nginx docker 部署springboot
- 我永远喜欢着OOP——第一次总结
我永远喜欢着OOP--第一次总结 一.三次作业总结分析 1. 第一次作业 1.1 作业分析 第一作业主要是给我们引入了一个对于非法输入处理的思想,包括第一次上机,都一直围绕着一个全新的主题,就是非法输 ...