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);
}
    使用详情请参考: https://www.jianshu.com/p/b18cbc3e6b64

    

IE常见的兼容处理的更多相关文章

  1. javaScript与css、html常见的兼容

    最近几天总是遇到兼容问题,就整理了一下javaScript和html.css出现的常见兼容.有不全面或不对的欢迎大家指正.也希望这条博客可以帮到一些刚学习的前端的朋友. 一.javaScript出现的 ...

  2. WEB前端开发人员须知的常见浏览器兼容问题及解决技巧

    所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的 ...

  3. Javascript常见浏览器兼容问题

    常见浏览器原生javascript兼容性问题主要分为以下几类: 一.Dom 1.获取HTML元素,兼容所有浏览器方法:document.getElementById("id")以I ...

  4. 常见IE6兼容问题总结

    1.<!DOCTYPE HTML>文档类型的声明. 产生条件:IE6浏览器,当我们没有书写这个文档声明的时候,会触发IE6浏览器的怪异解析现象: 解决办法:书写文档声明. 2.不同浏览器当 ...

  5. 常见ie9兼容问题

    公司项目要求需要兼容ie9,开发过程中遇到了许多问题,在这里记录一下,希望可以帮到其他需要的小伙伴. 浏览器兼容性问题无外乎三点,css样式兼容.JavaScript兼容及h5部分标签的兼容.主要介绍 ...

  6. 常见浏览器兼容问题、盒模型2种模式以及css hack知识讲解

    什么是浏览器兼容问题?所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况.在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们 ...

  7. H5常见的兼容问题及解决

    最近这两天经常遇到一些麻烦的兼容问题,统一整理一下,比较简单也不是特别全面,希望大家多多交流. 几种IE6 bug的解决方法 1)png24位的图片在iE6浏览器上出现背景,解决方案是做成PNG8.也 ...

  8. JavaScript中几种常见的兼容问题及解决方案

    在js中好用的东西一般都存在兼容问题,以下,我整理了一些常用的兼容处理方法,自己用的时候可以把他们放在一个JS文件中,需要用到时候直接引入,会比较方便. 一.获取非行内样式 function getS ...

  9. H5混合开发中android终端和ios终端常见的兼容问题1

    转自 https://blog.csdn.net/xuehu837769474/article/details/80603898 1.安卓浏览器看背景图片,有些设备会模糊. 用同等比例的图片在PC机上 ...

随机推荐

  1. Springdata mongodb 版本兼容 引起 Error [The 'cursor' option is required, except for aggregate with the explain argument

    在Spring data mongodb 中使用聚合抛出异常 mongodb版本 为 3.6 org.springframework.dao.InvalidDataAccessApiUsageExce ...

  2. hibernate中的缓存问题与快照机制

    1.  什么是缓存 数据存储到数据库里面,数据库本身是一个文件系统,使用流方式操作文件(效率不高) 改进方式:把数据存到内存中,不需要使用流方式,可以直接读取内存中的数据 缓存:内存中的临时数据,当内 ...

  3. .net core 部署到 iis 步骤及报错解决方法

    我写了一个Asp.net core mvc项目,但是部署在iis发生了502.5的问题一直解决不了. 环境 系统:最强Win10; 工具:轻巧VS Code; 各种百度bing都没有我要的解决方案,说 ...

  4. 网络基础tcp/ip协议一

    计算机网络: 硬件方面:通过线缆将网络设备和计算机连接起来 软件方面:操作系统,应用软件,应用程序通过通信线路互连 实现资源共享,信息传递 计算机网络的功能: 数据通信 资源共享 增加可靠性 提高系统 ...

  5. ajax常用实例代码总结新手向参考(一)

    http的交互方法有四种:get.post.put(增加数据).delete(删除数据) put和delete实现用的是get和post   get方式 页面不能被修改,只是获取查询信息.但是提交的数 ...

  6. 使用阿里云主机离线部署CDH步骤详解

    一.Linux文件系统准备 1. 拍摄快照 登录阿里云控制台,拍摄快照,注意有几个关键点尽量拍摄快照,系统初始状态.CM环境准备完成.CM安装完成.CDH安装完成. 2. 挂载设备 三个主机都执行. ...

  7. armlinux下的网路传输(tcp/ip)

    /*ex2serv.c*/ #include <time.h> #include<stddef.h> #include <stdio.h> #include < ...

  8. org.hibernate.MappingException:Unknown entity:java.util.ArrayList

    1.错误描述 [CQ] ERROR [http-apr-8888-exec-3] com.opensymphony.xwork2.util.logging.commons.CommonsLogger. ...

  9. CentOS中配置lvm存储

    磁盘添加 vmware workstation 虚拟机为例 1.关闭虚拟机,在虚拟机设置中添加3块硬盘. 2.首先创建物理卷  pvcreate /dev/sdb /dev/sdc Physical ...

  10. Django学习-13-simple_tag使用

    一些HTML方法                {{item.event_start | date:"Y-m-d H:i:s"}}                     {{bi ...