amazeui学习笔记一（开始使用3）--兼容性列表compatibility
一、总结
1、不要用ie做前端测试，不要碰ie，尽量用google 浏览器： 按照微软官方的说法，IE 开发者工具中的浏览器模式也不一定靠谱；
2、 amazeui的浏览器支持情况：amazeui对google浏览器的支持是最最最最好的：amaze ui也支持最新版的ie，特别老的版本6789支持不好
二、兼容性列表compatibility
Compatibility
Amaze UI 面向现代浏览器开发，对 IE 8/9 等浏览器只提供有限的支持。
注意：
- 请不要使用
IETester这种不靠谱的工具测试； - 按照微软官方的说法，IE 开发者工具中的浏览器模式也不一定靠谱；
- 微软官方提供了各种 IE 测试虚拟机。
分级浏览器支持（GBS）
GBS 是 YUI 团队提出的应对日益增长的浏览器兼容问题的思路，详情可以查看 YUI 相关页面。
Amaze UI GBS 描述
- A 级：最高支持级别，充分利用 H5 和 CSS3 等技术，提供最优的视觉和交互效果。
- B 级：有限支持，基本的样式和正常的交互，不考虑视觉、交互效果。
- C 级：核心支持，显示语义化的 HTML 标记渲染的内容，不考虑样式和行为。
- X 级：未知、零散的很少使用或已经停止开发的浏览器，可能不支持，也可能支持。
Amaze UI GBS
按照国际惯例，Amaze UI 提供对主流浏览器（系统）最近两个稳定版本的全面支持。结合国内实际情况，一些浏览器的支持缩减为最新正式版，IE 则对更老版本做了有限支持。
Amaze UI 对浏览器做了一个粗略分级，优先支持 A 级浏览器。
由于资源有限，无法列出所有的浏览器，使用 WebKit 的浏览器只要不乱修改内核，理论上应该都支持。
关于浏览器功能支持的更多细节请参考 Can I use（UC 浏览器的数据已经被收录，不知是喜是忧）。
| OS/Browser | Ver | Windows | iOS(7.1.2+) | OS X (10.9+) | Android (4.1+) | WP(8+) |
|---|---|---|---|---|---|---|
| Chrome | L2 | A | A | A | A | N/A |
| IE | 10+ | A | N/A | N/A | N/A | A- |
| 9 | B | N/A | N/A | N/A | N/A | |
| 8 | C+ | N/A | N/A | N/A | N/A | |
| lte7 | C | N/A | N/A | N/A | N/A | |
| Firefox | L2 | A | N/A | A | X | N/A |
| Safari | L2 | X | A | A | N/A | N/A |
| Opera | L1 | X | N/A | N/A | X | N/A |
| Opera Coast | L1 | N/A | A | N/A | N/A | N/A |
| Opera Mini | L1 | N/A | X | N/A | X | X |
| Stock1 | L1 | N/A | N/A | N/A | X | N/A |
| UC 浏览器 | L1 | X | A | N/A | A | A- |
| 360浏览器 | L1-极速 | A- | X | N/A | X | N/A |
| L1-IE8 | C+ | N/A | N/A | X | N/A | |
| 搜狗浏览器 | L1-极速 | A- | N/A | N/A | N/A | N/A |
| L1-IE8 | C+ | N/A | N/A | N/A | N/A | |
| FF Mobile | L1 | N/A | N/A | N/A | X | N/A |
注释：
L代表last，L2- 最新的两个稳定版本；L1- 最新稳定版本。1安卓系统自动浏览器，由于部分厂商对浏览器做了修改，列为 X 级。
参考链接：
IE 8/9
- IE 8/9 不支持
transition，看不到任何动画效果； - IE 9 对 ES5 支持相对较好，引入完整的
amazeui.js不会报错，IE 8 则不然； - Web 组件部分不提供 IE 8/9 官方支持。
有限支持 IE 8/9 的 JS 插件：
- 警告框（Alert）；
- 按钮交互（Button）；
- 折叠面板（Collpase）；
- 下拉组件（Dropdown）；
- 模态窗口（Modal）；
- 弹出框（Popover）；
- 图片轮播（Slider）；
- 侧边栏（OffCanvas）；
- 滚动侦测（ScrollSpyNav）；
- 固定元素（Sticky）；
- 选项卡（Tabs）；
| 功能 | IE 8 | IE 9 |
|---|---|---|
border-radius | ||
box-shadow | ||
transform | ||
Flex Box | ||
transition | ||
placeholder | ||
IE 8
需要支持 IE 8 的用户请使用条件注释引入amazeui.legacy.jsamazeui.ie8polyfill.min.js。
<!--[if (gte IE 9)|!(IE)]><!-->
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script> <!--<![endif]--> <!--[if lt IE 9]> <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script> <script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script> <script src="assets/js/amazeui.ie8polyfill.min.js"></script> <![endif]--> <script src="assets/js/amazeui.js"></script>amazeui.ie8polyfill.js 中包含以下 polyfill：
HTML5 新元素
以下任意引入一个即可，Amaze UI 官网引的是 Modernizr。
Media Query
rem
box-sizing
IE 8 ignores
box-sizing: border-boxif min/max-width/height is used.
伪元素
IE 8 只支持 CSS 2.1 规范中的单冒号语法（:before/:after），不支持 CSS3 的双冒号语法(::before/::after)。
字体图标
参见 Bootstrap 中的 issue 及里面提供的解决方法。
关于 IE 6/7
Amaze UI 不会支持 IE 6~7。