iconfont1_图片分类及图标格式

一、图片分类

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等文件格式。

缺点：大小改变后，可能会出现锯齿效果，影响美观。

引申：

Css Sprite（雪碧图）是网页中图片的一种处理方式。将应用的比较小的图片合并为个大图片。

优点：减少http请求次数。

缺点：需要设置背景图的宽高和位置。当然我们也可以使用对应的工具获取大小和位置信息。

 

2、字体图标，可以使用color，font-size等字体样式来设置图片

（1）使用font+html方式，又称unicode引用

（2）使用font+css方式，又称font class方式引用

（3）使用symbol方式（彩色图标）