-1、html 兼容性问题
问题：HTML5新的语义标签在低版本的老IE浏览器中存在兼容性问题
解决方案：引用第三方解析库
<script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
-2、css兼容问题
1、图片问题
a、图片下方有间隙
解决方案：
（1）img{display：block}
b、图片的右侧有间隙
解决方案：
（1）不换行继续写
（2）设置浮动属性：float：left；
c、img和input一起使用垂直方向不对齐
解决方案：
（1）给img一个{vertial-align：center}
d、图片添加超链接，带边框（仅在IE浏览器中存在）
解决方案：
（1）img添加{border：none}
2、间距问题（margin和padding）
a、浏览器默认的内外边距不同
*{ maegin：0； padding：0； }
b、两个块级元素竖向的margin值不会叠加，其间距取最大值
c、给子元素加margin-top，但是作用在父元素上
解决方案：
（1）给父元素添加padding：0.1px；
（2）给父元素添加浮动；
3、行高和高度问题
a、浮动的副作用：父元素的高度塌陷
解决方案：
（1）给父元素添加高度
（2）在浮动的元素后面添加一个空白的div，给div清除浮动
（3）给父元素添加overflow：hidden；
4、鼠标手势
问题症状：FireFox的cursor属性不支持hand，但是支持pointer，IE两个都支持
解决方案：cursor：pointer
-3、浏览器优化方法：
优化原则：
DNS是否通过缓存减少查询时间
网络请求走最近的网络环境
相同的静态资源缓存
减少请求的大小
服务器渲染优化
1、减少HTTP请求，合理设置HTTP缓存
2、应用浏览器缓存
cookie，loactStorage（一般用于存储ajax返回的数据）；
3、启用压缩
在服务器端对文件进行压缩，在浏览器端对文件进行解压缩，这样可以有效的减少通信传输的数据量。
4、CSS Sprites
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。
CSS Sprites为一些大型的网站节约了带宽， 提高了用户的加载速度和用户体验，不需要加载更多的图片
对于图片而言，在页面刚加载的时候可以只加载第一屏，当用户继续往后滚屏的时候才加载后续的图片。
- jqueryLazyload方式 （ 依赖Jquery）
- echo.js方式 （Echo.js 是一个独立的延迟加载图片的 JavaScript 插件）
6、css放在页面最上部，javascript放在页面最下面