雪碧图使用场景
1.静态图片，不随用户信息的变化而变化
2.小图片，图片容量比较小
3.加载量比较大
一些大图一般不拼成雪碧图
目的：减少http请求数量加速内容显示，请求建立连接，花费额外时间

实现原理：
通过css background-position：X Y实现
拼合背景图的小图(X,Y）为负值
以图片左上角为原点建系
控制一个层，可显示区域范围大小，通过一个窗口，进行背景图的滑动

实现方式：
1.ps手动拼图
2.使用sprite工具自动生成：cssgaga


h3有margin和padding
display:block;之后行高才有用
将line-height与height设置相同为了使文字垂直居中
记得reset掉ul h3等的默认margin padding
雪碧图下移图标 y轴增加icon高度 用photoshop量取