解决老浏览器兼容问题

前言

现在框架都放弃了IE9以下的浏览器,不过中国的环境大家都知道的,没办法还是尽量满足吧.

简介

禁用IE兼容模式

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
...

提示IE7及更早的用户

<body>
  <!--[if lt IE 8]>
    <div class="alert alert-danger">您正在使用 <strong>过时的</strong> 浏览器. 是时候 <a href="http://browsehappy.com/">更换一个更好的浏览器</a> 来提升用户体验.</div>
  <![endif]-->
  ...

兼容IE8用户

因为IE8及早期版本不支持HTML5标签，所以针对IE8浏览器，我们引入html5shiv来使得HTML5标签在IE8中也能使用。在HTML文档的script区域加入以下代码：

1
2
3

<!--[if lt IE 9]>
  <script src="dist/lib/ieonly/html5shiv.js"></script>
<![endif]-->

因为IE8及早期版本同样不支持media query来实现响应式布局，我们同样可以通过条件注释引入respond.js来帮助ie实现该功能。

1
2
3

<!--[if lt IE 9]>
  <script src="dist/lib/ieonly/respond.js"></script>
<![endif]-->

因为IE8及早期版本不支持Canvas，如果你的产品用到ZUI中的图表视图，则需要引入 ExplorerCanvas 来支持绘图功能。

1
2
3

<!--[if lt IE 9]>
  <script src="dist/lib/ieonly/excanvas.js"></script>
<![endif]-->

参考文档

兼容浏览器