常见的浏览器兼容性问题和解决方法

1. png24 位的图片在IE6 浏览器上出现背景。
   解决方案：将图片做成png8 位。

2. 浏览器默认的margin 和padding 不同 。
   解决方案：加一个全局的{margin:0;padding:0;}来统一margin 和padding。

3. IE6 双边距 bug：块属性标签 float 后，又有横行的margin 情况下，在 IE6 显示的margin 比设置的大。
   浮动IE 产生的双倍距离（IE6双边距问题：在IE6下，如果对元素设置了浮动，同时又设置了margin-left或margin-right，margin值会加倍。）
   解决方案:在float的标签样式控制中加入 ——_display:inline;将其转化为行内属性。(_这个符号只有ie6会识别)

4. IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性;Firefox下,只能使用getAttribute()获取自定义属性。
   解决方法：统一通过getAttribute()获取自定义属性。

5. IE下,event对象有x,y属性,但是没有pageX,pageY属性; Firefox下,event对象有pageX,pageY属性,但是没有x,y属性。

6. Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示。
   解决方法：可通过加入 CSS 属性-webkit-text-size-adjust: none;解决。

7. 超链接访问过后hover样式就不出现了，被点击访问过的超链接样式不在具有hover和active了。
   解决方法：改变CSS属性的排列顺序：L-V-H-A : a:link {} a:visited {} a:hover {} a:active {}

8. 怪异模式问题：漏写DTD声明，Firefox仍然会按照标准模式来解析网页，但在IE中会触发怪异模式。
   为避免怪异模式给我们带来不必要的麻烦，最好养成书写DTD声明的好习惯。现在可以使用[html5]推荐的写法：<doctype html>

常用 hack 技巧

渐进识别的方式，从总体中逐渐排除局部。

.bb{ 
       background-color:#f1ee18;  /*所有识别*/ 
      .background-color:#00deff\9;   /*IE6、7、8 识别*/ 
      +background-color:#a200ff;  /*IE6、7 识别*/ 
      _background-color:#1e0bd1;  /*IE6 识别*/ 
     }  

各浏览器常用兼容标记一览表：