什么是精灵图？

1.概念

css sprite也叫精灵图or雪碧图，是一种网页图片应用处理方式。
它允许你将一个页面涉及到的所有的零星图片集合到一张大图中。
这样一来，当访问该页面时，就由原来的多次请求变为一次请求。
客户端每显示一张图片都会向服务器发送一次请求，图片越多请求越多，延迟的可能性就越大，同时对服务器会造成压力。
所以页面中如果有多个icon（小图标）时，推荐使用精灵图。

2.优点

1. 减少网页的http请求，从而提升网页的性能。

2. 减少图片的字节。

3.原理

1. 需要一个设置好宽高的容器。
2. 通过background-img引入背景图。
3. 通过background-position将背景图移动到需要的位置。