1.前言
一，为什么会出现浏览器兼容问题。
不同浏览器的内核不一样，所以不同浏览器对代码的解析会存在差异。导致渲染出来的页面效果会存在差异.
常见的浏览器内核可分为四种：Trident、Gecko、Blink、Webkit
IE浏览器 Blink内核（俗称IE内核）
chrome浏览器（谷歌浏览器） webkit内核（现在是Blink内核）
Firefxo浏览器 （火狐浏览器） Gecko内核（俗称FireFxo内核）
QQ浏览器 Trident内核（兼容模式）+webKit内核（高速模式）
猎豹浏览器 chrome+IE(双内核)
360浏览器 chrome+IE（双内核）
百度 IE内核
opera浏览器 最初是自己的Presto内核，后来加入谷歌大军，从Webkit又到了Blink内核
二常见的浏览器兼容性问题及解决方案
常见的兼容性问题可分为三类
1.Html兼容
2.CSS兼容
3.javascript兼容
HTML部分
A，对应Html兼容，主要是一些低版本的浏览器不能识别高版本浏览器使用的一些标签,从而导致不能解析，比如html5新增的一些标签。
解决办法：可以用htmlshim框架可以让低于IE9的浏览器支持HTML5
B，img的alt属性 在没有图片的情况下各浏览器的解析不一致。
1.IE浏览器只显示alt文字，谷歌浏览器一张破损的图片加alt文字，360浏览器一张破损的图片加alt文字，火狐浏览器只显示alt文字。默认给一张默认图片。
css部分
A,不同浏览器标签的marign和padding不同。
解决方案：在css代码里添加如下代码：
*{
margin:0;
padding:0;
}
B,IE6下marign双倍边距的问题
问题表现，元素浮动之后，margin值变双倍。
解决方案：
{
display:block
}
C，IE6下img下面有间距
解决方案：设置display:block;
D,标签min-height的问题
问题表现：min-height本身就是一个不兼容CSS的属于，所以min-height不能很好的没各个浏览器解析。
解决方案：{
min-height:200px;
height:auto!important;
height:200px;
overflow:visible;
}
E,opacity多浏览器透明度问题，
问题表现opacity是css3的属性，部分浏览器能够解析
解决方法：使用各个浏览器的私有属性以支持opacity
{
filter:alpha(opacity=50);/*IE*/
-moz-opacity:0.5;/*老版Mozilla*/
-khtml-opacity:0.5;/*老版Safari*/
opacity:0.5;
}
JS部分
