1.位图和矢量图
1.1 位图（记述性）
位图的工作是基于方形像素点的,把图像分为若干个点(像素)，从而储存或再现整幅图像。由于像素数量的限制，所以点阵图像的大小是固定的。缩小或放大图像都会造成对图像的破坏，看下的例子：
A、B、C、D四个像素，要将2x2扩成3x3，那么就要多出5个像素。图中的标号是1、2、3、4、5。
如何确定这原先并不存在的像素的颜色呢？是将现有两个像素的颜色值取平均，去作为新像素的颜色。也就是说AB运算后得出1；AC运算后得出2；BD得出4；CD得出5；3则是由1245运算得出的。
1.2 矢量（描述性）
矢量图片，由对象组成。每个对象都是一个自成一体的实体，它具有颜色、形状、轮廓、大小和屏幕位置等属性。既然每个对象都是一个自成一体的实体，就可以在维持它原有清晰度和弯曲度的同时，多次移动和改变它的属性，而不会影响图例中的其他对象。矢量图像属于描述性，以线段和计算公式作为记录的对象
1.3 对比
想象一条直线，如果以点阵方式来记录，就是从左上角第一个点开始，到右下角最后一个点结束，记录所有像素的颜色。 记录这幅图像(200×50像素)就需要1万个信息。即使这条直线本身并没有那么多像素，但点阵方式也是完整的把整幅图的像素记录下来。如果用矢量来记录这条直线，只需要三个信息：直线起点坐标、直线终点坐标、直线的颜色
从获取图像这个角度来说，矢量不适合记录色彩较为复杂的图像。所谓获取就是拍照、扫描这类，因为色彩太复杂，矢量格式就要为每个色彩的变化去计算坐标。 如果从创作图像的角度来说，矢量格式同样可以具有非常丰富的色彩
另外显示器是点阵的，包括传统的CTR显示器、液晶显示器、等离子显示器等。 无论你在制作时候采用点阵还是矢量，在显示器上显示出来的话，最终还是以点阵方式展现的。
2.RGB
电子设备上显示的数字图像颜色组成是RGB（红黄蓝),这是一种发光色彩。相对应的有CMYK反光色彩，用于印刷（C代表青色，M代表洋红色，Y代表黄色，K代表黑色）；
2.1 图像大小
每个像素存储’RGBA‘值：(R) 红色通道、(G) 绿色通道、(B) 蓝色通道和 (A) alpha（透明度）通道。在浏览器内部为每个通道分配 256 个值（色阶），转换为每个通道 8 位 (2 ^ 8 = 256)，每个像素 4 个字节。因此，如果知道图像尺寸，可以很容易计算文件大小：
100 x 100 像素的图片 = 10,000 像素 x 4 个字节 = 40,000B / 1024 = 39KB
每个通道256的值，可以为我们提供1677W的颜色（256256256=16,777,216），这超过了一般人眼的分辨力，所以也称为真彩色
3 图像像素和显示密度
3.1 总像素
3.2 显示密度 DPI/PPI
dpi是dot per inch，每英寸多少点，ppi是 Pixel per inch，每英寸像素数，针对显示器的设计时，dpi=ppi(下面都用PPI）。图片的总像素/PPI，就是图片在介质上显示的大小。同一张图片,PPI高的肯定会显示的小一点，这里有很多相关的概念，retina、android里的dp单位、android里的HDPI、MDPI、LDPI等。
参考：
