CSS精灵图/雪碧图

精灵图

精灵图也称为雪碧图，为什么有精灵图呢？因为很多大型网页中加载的时候需要下载很多图片，这样对网络负担很大，因此精灵图把很多小图片合并到一张大图片中，这样加载的时候只会加载一张却能在好几个地方使用。

使用方式

精灵图在样式表中的background

background:url("图片的地址") left top;

left 和 top组合来调整 你想使用精灵图中某个图片的具体位置
当然也可以使用background-position来调整

background:bg-color（背景颜色） bg-image（背景图URL） position/bg-size（背景图的大小或者位置写在这里） bg-repeat（图片是否铺开） bg-origin（	指定背景图像的定位区域） bg-clip（指定背景图像的绘画区域） bg-attachment（设置背景图像是否固定或者随着页面的其余部分滚动。） 

精灵图大小调整

background-size: ..px;

可以控制精灵图的大小