一、图片分类
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方式(彩色图标)