1、IE8下面的png图片无法正常显示?
原因：打开调试面板，你会发现IE8浏览器把PNG格式的img解析成了span标签，导致图片无法显示。
解决方案：在央视里面对span设置宽高和display:inline-block;
2、rgba不支持IE8?
解决方案:可以用 opacity
opacity:0.7;/FF chrome safari opera/
filter:alpha(opacity:70);/用了 ie 滤镜,可以兼容 ie/
但是,需要注意的是,opacity 会影响里面元素的透明度
3、css3的新属性？
Trident内核：主要代表为IE浏览器
Gecko内核：主要代表为Firefox FF
Presto内核：主要代表为Opera
Webkit内核：主要代表为Chrome和Safari
对应浏览器的私有属性：
Trident内核：前缀-ms
Gecko内核：前缀-m
Presto内核:前缀-o
Webkit内核：前缀-webkit
4、window.event||event
移动端常见的兼容性问题
1、html5调用安卓或者ios的拨号功能
html5提供了自动调用拨号的标签，只要在a标签的href中添加tel：就可以了。如下：
< a href=" ">400-810-6999 转 1034</ a>
拨打手机如下：
点击拨打
2、上下拉动滚动条时卡顿、慢
body{
-webkit-overflow-scrolling:touch;
overflow-scrolling:touch;
}
Android3+和IOS5+支持CSS的新书行为overflow-scrolling
3、圆角bug
某些Android手机圆角失效
background-clip:padding-box
4、ios设置input按钮样式会被默认样式覆盖
解决方式：
input,textarea{
border:0,
-webkit-apperence:none
}
5.IOS键盘字母输入，默认首字母大写
解决方案，设置如下属性
<input type="text"autocapitalize="off"/>
6.h5底部输入框被键盘遮挡问题
h5页面有个问题是，当输入框在最底部，点击软键盘后输入框会被遮挡。可采用如下方式解决
var oHeight = $(document).height(); //浏览器当前的高度
$(window).resize(function(){
if($(document).height() < oHeight){
$("#footer").css("position","static");
}else{
$("#footer").css("position","absolute");
}
});
7.IOS移动端click事件300ms的延迟响应
解决方案：
1、fastclick可以解决在手机上点击事件的300ms延迟
2、zepto的touch模块，tap事件也是为了解决在click的延迟问题
3、触摸事件的响应顺序为touchstart --> touchmove --> touchend --> click,也可以通过绑定ontouchstart事件，加快对事件的响应，解决300ms延迟问题
8.在ios和andriod中,audio元素和video元素在无法自动播放
应对方案：触屏即播$('html').one('touchstart',function(){audio.play()})
9.CSS动画页面闪白,动画卡顿
解决方法:
1.尽可能地使用合成属性transform和opacity来设计CSS3动画，不使用position的left和top来定位
2.开启硬件加速
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
10.fixed定位缺陷
1、ios下fixed元素容易定位出错，软键盘弹出时，影响fixed元素定位
2、android下fixed表现要比iOS更好，软键盘弹出时，不会影响fixed元素定位
3、ios4下不支持position:fixed解决方案：可用iScroll插件解决这个问题