在不同的浏览器中，浏览器的内核都是不相同的，所以各个浏览器对网页的解析存在一定的差异。
浏览器内核主要分为两种，一是渲染引擎，另一个是js引擎，所以浏览器的兼容性问题一般是指:css兼容、js兼容
Css兼容性问题：
1。不同浏览器的标签默认的margin和padding不同浏览器兼容性问题
解决办法：可以通过设置全局样式来解决这个问题，这样所有的样式都会重置，初始值都会相同了。
2。css3新属性，加浏览器前缀兼容早期浏览
-moz- / 火狐浏览器 /
-webkit- / Safari, 谷歌浏览器等使用Webkit引擎的浏览器 /
-o- / Opera浏览器(早期) /浏览器兼容性问题
-ms- / IE /
3。块属性标签float后，又有横行的margin的情况下，IE浏览器margin加倍的问题
设置为float的p在IE下设置的margin会加倍。这是一个IE6都存在的bug。解决方案是在这个p里面加上display:inlin。
4。设置较小高度标签（小于一般10px），在IE6，IE7，遨游中高度超出自己设置高度
可以通过给高出的标签设置overflow:hidden
或设置行高line-height小于你设置的高度
5。行内属性标签，设置display:black后采用float布局，又有横行的margin的情况下，IE6间距bug
IE6里的间距比超过设置的间距，可以通过在display:block;后面加入display:inline;display:table;
6。IE浏览器p最小高度和宽度的问题 浏览器兼容性问题
加宽高，并且宽高加auto
7。超链接访问过hover样式就不出现的问题
被点击访问过的超链接样式不在具有hover和active了,很多人应该都遇到过这个问题,解决技巧是改变CSS属性的排列顺序: L-V-H-A
a:link{}>a:visited{}>a:hover{}>a:active{}
8。图片默认有间距
几个img标签放在一起的时候，有些浏览器会有默认的间距，通配符清除间距也不起作用。
可以通过使用float属性为img布局(所有图片左浮)
9。 css hack解决浏览器兼容性
不同浏览器，识别不同的样式，css hack本身就是处理浏览器兼容的
二、js兼容
1。 事件绑定
IE: dom。attachEvent();
标准浏览器： dom。addEventListener(‘click',function(event){},false);
var x = document。getElementById("myBtn");
if (x。addEventListener) { //所有主流浏览器，ie9+
x。addEventListener("click", myFunction);
} else if (x。attachEvent) { // IE 8 及更早 IE 版本
x。attachEvent("onclick", myFunction);
}
2。event事件对象问题
document。οnclick=function(ev){//谷歌火狐的写法，IE9以上支持，往下不支持；
var e=ev;
console。log(e);
}
document。οnclick=function(){//谷歌和IE支持，火狐不支持；
var e=event;
console。log(e);
}
document。οnclick=function(ev){//兼容写法；
var e=ev||window。event;
var mouseX=e。clientX;//鼠标X轴的坐标
var mouseY=e。clientY;//鼠标Y轴的坐标
}
3。 event。srcElement(事件源对象)问题
IE： event对象有srcElement属性，但是没有target属性； 浏览器兼容性问题:http://www.youerw.com/fanwen/lunwen_99312.html