IE常见的兼容处理
IE常见的兼容处理
1. 禁用IE兼容模式
为了保证IE能够使用最新渲染模式而不是兼容模式，在html文档头部应加入以下代码：
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
...
2. 提示IE7及更早版本的用户
针对IE7及更早的版本，应该给出提示，让用户升级浏览器。在body之后加入以下代码可以有选择性的出现浏览器升级提示，并给出链接引导用户访问browsehappy.com：
<body>
<!--[if lt IE ]>
<div class="alert alert-danger">您正在使用 <strong>过时的</strong> 浏览器. 是时候 <a href="http://browsehappy.com/">更换一个更好的浏览器</a> 来提升用户体验.</div>
<![endif]-->
...
如果你准备支持的IE浏览器最低版本为IE9，也建议为早期用户准备一个提示，只需要将以上代码中的 [if lt IE 8] 更改为 [if lt IE 9]。
3. IE8用户 （需要的文件可以自己百度到）
因为IE8及早期版本不支持HTML5标签，所以针对IE8浏览器，我们引入html5shiv来使得HTML5标签在IE8中也能使用。在HTML文档的script区域加入以下代码：
<!--[if lt IE ]>
<script src="html5shiv.js"></script>
<![endif]-->
因为IE8及早期版本同样不支持media query来实现响应式布局，我们同样可以通过条件注释引入respond.js来帮助ie实现该功能。
<!--[if lt IE ]>
<script src="respond.js"></script>
<![endif]-->
因为IE8及早期版本不支持Canvas，如果你的产品用到图表 视图，则需要引入 ExplorerCanvas 来支持绘图功能。
<!--[if lt IE ]>
<script src="excanvas.js"></script>
<![endif]-->
4. 低版本IEcss3支持CSS3部分属性 （PIE.htc）
下载地址： http://css3pie.com
用 PIE.htc 来让IE浏览器支持CSS3的 border-radius、box-shadow、CSS3 Backgrounds (-pie-background)、Gradients、RGBA属性。
要使用 PIE 应用就要先把它引进来，这里不是在 html 文件里面引入，而是在 css 文件里面使用 behavior 来对文件进行导入。
注：PIE.htc URL路径是相对于当前HTML文件，而不是CSS文件.
.borderRadius{
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
background: #ABCDEF;
behavior: url(css/PIE.htc);
}
IE常见的兼容处理的更多相关文章
- javaScript与css、html常见的兼容
最近几天总是遇到兼容问题,就整理了一下javaScript和html.css出现的常见兼容.有不全面或不对的欢迎大家指正.也希望这条博客可以帮到一些刚学习的前端的朋友. 一.javaScript出现的 ...
- WEB前端开发人员须知的常见浏览器兼容问题及解决技巧
所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的 ...
- Javascript常见浏览器兼容问题
常见浏览器原生javascript兼容性问题主要分为以下几类: 一.Dom 1.获取HTML元素,兼容所有浏览器方法:document.getElementById("id")以I ...
- 常见IE6兼容问题总结
1.<!DOCTYPE HTML>文档类型的声明. 产生条件:IE6浏览器,当我们没有书写这个文档声明的时候,会触发IE6浏览器的怪异解析现象: 解决办法:书写文档声明. 2.不同浏览器当 ...
- 常见ie9兼容问题
公司项目要求需要兼容ie9,开发过程中遇到了许多问题,在这里记录一下,希望可以帮到其他需要的小伙伴. 浏览器兼容性问题无外乎三点,css样式兼容.JavaScript兼容及h5部分标签的兼容.主要介绍 ...
- 常见浏览器兼容问题、盒模型2种模式以及css hack知识讲解
什么是浏览器兼容问题?所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们 ...
- H5常见的兼容问题及解决
最近这两天经常遇到一些麻烦的兼容问题,统一整理一下,比较简单也不是特别全面,希望大家多多交流. 几种IE6 bug的解决方法 1)png24位的图片在iE6浏览器上出现背景,解决方案是做成PNG8.也 ...
- JavaScript中几种常见的兼容问题及解决方案
在js中好用的东西一般都存在兼容问题,以下,我整理了一些常用的兼容处理方法,自己用的时候可以把他们放在一个JS文件中,需要用到时候直接引入,会比较方便. 一.获取非行内样式 function getS ...
- H5混合开发中android终端和ios终端常见的兼容问题1
转自 https://blog.csdn.net/xuehu837769474/article/details/80603898 1.安卓浏览器看背景图片,有些设备会模糊. 用同等比例的图片在PC机上 ...
随机推荐
- 遇到502错误,invalid request block size 解决方法
uWSGI是一个Web服务器,它实现了WSGI协议.uwsgi.http等协议.Nginx中HttpUwsgiModule的作用是与uWSGI服务器进行交换. 因为业务需求,要最多输入350个汉字,在 ...
- webpack打包速度和性能再次优化
一. 改单dll为双dll 因为上图原因,使用CommonsChunkPlugin时,导致其打包出来的vendors.js内的模块ID会因为其他文件引用模块数量的变化而变化. 所以现利用DllPlug ...
- pc浏览器css和js计算浏览器宽度的差异以及和滚动条的关系
如图: css宽度:1250 不包括滚动条宽度 用控制台箭头选取元素显示的左边的宽度:1250 不包含滚动条宽度 缩放浏览器右上角显示的宽度:1267 包含了滚动条宽度 再看下控制台: 由此可计算浏 ...
- ajax常用实例代码总结新手向参考(一)
http的交互方法有四种:get.post.put(增加数据).delete(删除数据) put和delete实现用的是get和post get方式 页面不能被修改,只是获取查询信息.但是提交的数 ...
- 【前端】Vue2全家桶案例《看漫画》之五、引入axios
转载请注明出处:http://www.cnblogs.com/shamoyuu/p/vue_vux_app_5.html 项目github地址:https://github.com/shamoyuu/ ...
- Bind、Apply、Call三者的区别
1)bind与apply.call 的最大区别就是:bind不会立即调用,其他两个会立即调用 var fn = { _int: function(){return 3}, fun: function( ...
- MxNet+R︱用R语言实现深度学习（单CPU/API接口,一）
MxNet有了亚马逊站台之后,声势大涨,加之接口多样化,又支持R语言所以一定要学一下.而且作为R语言的fans,为啥咱们R语言就不能上深度学习嘞~ -------------------------- ...
- 判断一个jquery对象是否为空
今天用jquery $获取一个jquery对象.$("#id") 然后用判断这个对象是否存在,id不存在的时候,判断这个是否存在, if($("#id")) 始 ...
- Struts2实现文件上传（四）
Struts2实现文件上传 配置文件struts.xml <!-- /* * $Id: struts.xml 1364077 2012-07-21 12:57:02Z lukaszlenart ...
- com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Unknown database 'smvch'
1.错误描述 INFO:2015-05-01 14:20:44[main] - Initializing c3p0 pool... com.mchange.v2.c3p0.ComboPooledDat ...