精灵技术（雪碧图）

精灵技术

CSS精灵的英文叫法CSS sprites（又称为雪碧图），通常被解释为“CSS图像拼合”或“CSS贴图定位”，

其实就是把网页中的一些背景图片整合到一张图片文件中，再利用CSS“background-imge”,"background-repeat"

"background-position"的组合进行背景定位，"background-position"精确定位出背景图片的位置

实现步骤：

①限定容器大小

②图片拼合

③背景定位

优点：、

①减少网页http的请求，从而大大提高页面的性能，

②解决图片上命名的困扰

③更换风格方便

缺点：

①必须要限定容器的大小

②需要计算位置

使用场景：

适用于一般小图片（包括小图标，小背景），不适合大背景和大布局的