浏览器内核：
市面五大浏览器：
-谷歌浏览器：使用苹果的webkit内核，开创了blink内核，前缀 -webkit-
-火狐浏览器：内核是Gecko，前缀 -moz-
-opera浏览器：内核是blink，以前的内核是presto，前缀 -o-
-safari浏览器：苹果自己的内核webkit，前缀 -webkit-
-IE浏览器：IE4以上版本都是Trident内核，前缀 -ms-
IE常见bug：
1）图片有边框，解决方法：给图片加border：0或border:none;
2）图片间隙（下方撑大3~6px），解决方法：给图片加vertical-align: top
3）双倍边距（只有IE6出现），解决方法：给浮动元素加display：inline
4）默认高度（IE6、IE7，部分块元素有默认高度16px左右），解决方法：给元素加font-size：0或overflow：hidden
非IE bug：
1）表单元素行高对齐不一致，解决方法：给表单元素加 float：left；
- input默认的边距 padding:1px 2px
- input默认的边框 border-width:2px（outline: none）
- type类型为button 怪异盒模型
2）鼠标指针形状为手型：cursor：pointer
透明/隐藏：
- rgba(,,,alpha) 单个元素
- opacity 全部元素（0~1）（IE浏览器写法：filter:alpha(opacity=value);取值范围 1-100(整数)）
- transparent 透明
- hsla() 硬件
- overflow:hidden
- visibility:hidden
- display:none
- transform:scale(0)
- backface-visibility:hidden
图片整合技术：css sprites 精灵图、雪碧图
原理:background-position:x y
优点:1） 将所有的小图标放在一张大的图片上可以减少体积；2）只需要请求一次 减轻服务器的压力；
缺点：- 计算麻烦 位置；- 作图麻烦；
面试:如何优化页面加载速度？答： htm+css代码压缩(gulp\webpack)、图片整合技术(小图标)