css雪碧图，也叫精灵图，当我们在页面上需要展示很多小图标时，为了减少http请求，把多个小图合并成一个大图，通过css 设置background-position来控制展示图片的位置

缺点：

  1. 不利于管理，图片变化时可能需要修改很多
  2. 图片过多时，通过position定位工作量大

总结：
项目中用雪碧图时最好把不怎么可能会变动的图片绘制成精灵图，把同一类型、宽高相同的小图放到一张雪碧图上

雪碧图和字体图标iconfont：

对比角度 雪碧图 字体图标
图标需要换颜色或者其他效果 需要换图片，重新做精灵图 改变一下color就可以
图标上多个颜色 直接用图片很好展示 多色图标较难实现
高分辨率 高分辨率下可能会模糊 本质上是文字，受分辨率影响小
体积 图片体积较大 文字图标体积小