一、需要兼容那些浏览器

根据用户群体决定兼容哪些浏览器：

（1）面向普通用户

IE8+，Chrome,Firefox

(2)企业级产品

IE9+，Chrome,Firefox

 

如何了解浏览器市场份额：

百度统计：

 

二、浏览器兼容方案

1、css层叠原理

1 div {2                 display: -webkit-box;3                 display: -webkit-flex;4                 display: -moz-box;5                 display: -ms-flexbox;6                 display: flex7             }

如上面代码所示，同一个属性，后面书写的值会覆盖前面书写的值，并且对于浏览器无效的属性值会被忽略。

2、条件注释

针对IE6，IE7，IE8，IE9的条件注释，见如下代码：

 

效果：

（1）chrome下：

（2）IE下（如IE8）：

 

 

 这样就可以针对不同的浏览器做兼容性处理了，如：

1 .ie8 .selector{2                 /*样式*/3             }

3、CSS hack

具体示例见如下代码：

1  2  3  4      5         
      6          7         24     25 26     27         
     
      28             12329         
     
30     31 32