精灵图

精灵图可以叫雪碧图也叫css sprites

一. 精灵图的实质其实就是利用背景图和背景图的位置去显示同一张图上，不同位置的图片，进而，在引入一张图的前提下，显示不同的图片的技巧。它适合：一般小图标素材。

二.优缺点

优势：

加快网页加载速度

浏览器接受的同时请求数是10个，如果图片过多会影响整体的视觉效果，而且对于不稳定的网络带宽，加载起来更是噩梦，所以把图片拼接为一张大图，从而加快加载速度，以及加速页面渲染

后期维护简单

该工具可以直接通过选择图片进行图片的拼接，当然你也可以自己挪动里面的图片，自己去布局你的雪碧图，直接生成代码，简单易用

缺点：

在图片合并的时候，你要把多张图片有序的合理的合并成一张图片，还要留好只够的空间，防止板块内不会出现不必要的背景，如果留空间或拼合位置不合适，在布局时容易出现布局这个盒子对象时，设置背景出现拼合相邻图片，干扰图片的情况;

精灵图可以叫雪碧图也叫css sprites

一. 精灵图的实质其实就是利用背景图和背景图的位置去显示同一张图上，不同位置的图片，进而，在引入一张图的前提下，显示不同的图片的技巧。它适合：一般小图标素材。

二.优缺点

优势：

加快网页加载速度

浏览器接受的同时请求数是10个，如果图片过多会影响整体的视觉效果，而且对于不稳定的网络带宽，加载起来更是噩梦，所以把图片拼接为一张大图，从而加快加载速度，以及加速页面渲染

后期维护简单

该工具可以直接通过选择图片进行图片的拼接，当然你也可以自己挪动里面的图片，自己去布局你的雪碧图，直接生成代码，简单易用

缺点：

在图片合并的时候，你要把多张图片有序的合理的合并成一张图片，还要留好只够的空间，防止板块内不会出现不必要的背景，如果留空间或拼合位置不合适，在布局时容易出现布局这个盒子对象时，设置背景出现拼合相邻图片，干扰图片的情况;