图片分类
1、位图图片：最小单位由像素构成的图，缩放会失真。常用格式bmp，jpg，gif，png。
2、矢量图图片：矢量图纪录了元素形状及颜色的算法，以数学函数来实现。以svg格式为代表，可缩放矢量图形(scalable vector graphics)。其他格式cdr、ai、SWF、SVG、WMF、 EMF、EP、DXF格式等。
优缺点：
1、位图的好处是，色彩变化丰富，编辑上，可以改变任何形状的区域的色彩显示效果。缺点位图占用空间较大；
2、矢量的好处是，无论放大、缩小或旋转等都不会失真；缺点是难以表现色彩层次丰富的逼真图像效果，而且显示矢量图也需要花费一些时间。矢量图形主要用于插图、文字和可以自由缩放的徽标等图形。另外，支持矢量格式的应用程序也远远没有支持位图的多，很多矢量图形都需要专门设计的程序才能打开浏览和编辑。
3、矢量图很容易转换为位图。反之则很困难。
图标格式
1、采用图片格式，有bmp，jpg，gif，png等文件格式。
缺点：大小改变后，可能会出现锯齿效果，影响美观。
2、字体图标，可以使用color，font-size等字体样式来设置图片
（1）使用font+html方式，又称unicode引用
（2）使用font+css方式，又称font class方式引用
（3）使用symbol方式（彩色图标）
Css Sprite（雪碧图）是网页中图片的一种处理方式。将应用的比较小的图片合并为个大图片。
优点：减少http请求次数。
缺点：需要设置背景图的宽高和位置。当然我们也可以使用对应的工具获取大小和位置信息。
svg矢量图库：
阿里巴巴矢量图标库：http://www.iconfont.cn
icomoon图标库官网：https://icomoon.io/app/#select