css精灵技术

css精灵技术

css精灵是一种处理网页背景图的方式，他就是将零星的小图片整合到一个大图片里，用定位的方式显示出你想要的部分，他只需要向服务器发送一次请求就可以加载出网页中所有的背景图片。
css精灵图的工作原理
CSS雪碧的基本原理是把你的网站上用到的一些图片整合到一张单独的图片中，从而减少你的网站的HTTP请求数量。该图片使用CSS background和background-position属性渲染，这也就意味着你的标签变得更加复杂了，图片是在CSS中定义，而非< img>标签。
优点：

（1）减少加载网页图片时对服务器的请求次数

可以合并多数背景图片和小图标，方便在任何位置使用，这样不同位置的请求只需要调用一个图片，从而减少对服务器的请求次数，降低服务器压力，同时提高了页面的加载速度，节约服务器的流量。

（2）提高页面的加载速度

sprite技术的其中一个好处是图片的加载时间（在有许多sprite时，单张图片的加载时间）。由所需图片拼成的一张GIF图片的尺寸会明显小于所有图片拼合前的大小。单张的GIF只有相关的一个色表，而单独分割的每一张GIF都有自己的一个色表，这就增加了总体的大小。因此，单独的一张JPEG或者PNG sprite在大小上非常可能比把一张图片分成多张得来的图片总尺寸小。