关于浏览器的兼容性问题和css hsck
五大主流浏览器包括：
chorme (webkit)
safari (webkit)
IE (Trident)
firefox(Gecko)
Orpera(Presto)，现在opera内核已经改啦，基于webkit。
既然浏览器不同，那么当然去渲染效果就不一样了，也就出现了我们最头疼的问题--web应用的兼容性问题。这里最烦人的就是IE啦，也就是我们经常开玩笑的说只有有兼容性问题就说是IE6/7/8，当然各种浏览器模式下都有自己的弊端，对于IE的处理我们一般通过css hack(盒模型)来处理，也就是在写样式的时候差别对待，通过给样式加“+”、“-”、“\\”、“*”等符号标示来分别处理不同浏览器的样式。
1、png24位的图片在IE6浏览器上出现背景，解决方案是做成PNG8，也可以引用一段脚本来处理。
2、浏览器默认的margin和padding不同，解决方案是加一个全局的*{marign:0;padding:0;}来统一；
3、IE6双边距bug：块属性标签float后，又有横行的marign情况下，在IE6显示margin比设置的大。
4、浮动IE产生的双倍距离（IE6双倍边距问题：在IE6下，如果对元素设置了浮动，同时又设置了margin-left或者margin-right,margin值会加倍。）
#box {float:left;width:10px;marign:0 0 0 100px;}
这种情况下IE会产生20px 的距离，解决方案是在float的标签式控制中加入_display:inline;
将其转化为行内属性（_这个符号只有IE6会识别）；
5、渐进识别对的方式，从总体中逐渐排除局部。
首先，巧妙的使用'\\9'这一标记，将IE浏览器从所有的情况中分离出来。
接着，再次使用'+'将IE6、IE7、IE8分离开来，这样IE8已经独立识别。
css
.bb{
background-color:red; /*所有识别*/
.background-color:red\9; /*IE6、IE7、IE8识别*/
+background-color:red; /*IE6、IE7识别*/
_background-color:red; /*IE6识别*/
}
6、IE下，可以使用获取常规属性的方法来获取自定义属性，也可以使用getAttribute()获取自定义属性，firefox下，只能使用getAattribute()获取自定义属性；
解决方法：统一通过getAttribute()获取自定义属性。
7、IE下，event对象有x,y属性，但是没有pageX,pageY属性；
Firxfox下，event对象没有x,y属性，但是有pageX,pageY属性；
解决方法：（条件注释）缺点是在IE浏览器下可能会增加额外的HTTP请求次数。
8、chrome中文界面下默认会将小于12px的文本强制按照12px显示;
解决方法：可以通过加入css属性-webkit-text-size-adjust:none;
9、超链接访问过后hover样式后hover和active就不出现啦;
解决方法：改变css属性的排列顺序：L-V-H-A
10、怪异模式问题：漏写DTD声明，Firxfox仍然会按照标准模式来解析网页，但在IE中会触发怪异模式。为避免怪异模式给我们带来的不必要的麻烦，最好养成书写DTD声明的好习惯。现在可以使用【html5】(http://www.w3.org/TR/html5/single-page.html)推荐的写法：`
11、上下marign重合问题
IE和Firxfox都存在，相邻的两个div的marign-left和marign-right不会重合，但是marign-top和 margin-bottom却会发生重合。
解决方法：养成良好的代码编写习惯：同时采用margin-top或者同时采用margin-bottom.
12/