浅谈浏览器兼容解决方案

@一、需要兼容那些浏览器

根据用户群体决定兼容哪些浏览器：
（1）面向普通用户
IE8+，Chrome,Firefox
(2)企业级产品
IE9+，Chrome,Firefox

如何了解浏览器市场份额：
百度统计：http://tongji.baidu.com/data/browser/

二、浏览器兼容方案

1、css层叠原理

div {
                display: -webkit-box;
                display: -webkit-flex;
                display: -moz-box;
                display: -ms-flexbox;
                display: flex
            }

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

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

效果：

（1）chrome下：

Paste_Image.png

（2）IE下（如IE8）：

Paste_Image.png

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

.ie8 .selector{
               /*样式*/
         }

3、CSS hack

具体示例见如下代码：

    
        
        
        
    

    
        

            123