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);
}
最新文章
- maven 详解
- 在ASP.NET Core中实现一个Token base的身份认证
- IIS配置文件的XML格式不正确 applicationHost.config崩溃 恢复解决办法
- 恢复 git reset -hard 的误操作
- java 操作excel 文件
- android 通知栏 notifcation
- 安装Windows7出现:”安装程序无法创建新的系统分区 也无法定位系统分区“ 终极解决方案
- 坑爹的Mysql
- L2TP
- python学习第十八天 --文件操作
- shell中的case表达式
- javascript,css3加载动画
- XML 文档解析操作
- 高级特性(2)- XML
- 头文件 boost/cstdint.hpp
- 【Espruino】NO.12 加速度计演示
- c# 获取当前时间的微秒
- CustomScrollView
- Vue01
- 转发 Delphi中线程类TThread 实现多线程编程