1.像素
一张图片60 50的分辨率 说明这张图片每一行有60个像素 共50行 总共有60 50 = 3000个像素 每个像素都有自己独立的颜色
也就是说如果一张图片的分辨率是W*H那么每一行都有W个像素共有H行 总共W*H个像素 宽度为W 高度为H 每个像素都有自己独立的颜色
2.RGB 颜色模型（RGB color model）又称为三原色光模式，每个像素的颜色可以通过 red blue green以不同的含量混合而成
3.位深度
每一个像素的颜色信息如何存储的呢？
3.1：取决于图片的位深度（Bit Depth）也称为：色彩深度（Color depth）简称色深
3.2：如果一张图片的位深度为n,那么它的每一个像素都会使用n个二进制来存储颜色信息
24bit位深度的含义：
1.每个像素都会使用24个二进制来存储颜色信息
2.每个像素的颜色都是由red blue green 三个颜色通道合成的
3.每个颜色通道都用8bit来表示其含量 取值范围：
二进制：00000000~11111111
十进制：0~255
十六进制：00~FF
举例说明：
01000000 11100000 11010000 共24bit
red: 01000000 十进制：64 十六进制：40
green: 11100000 十进制：224 十六进制：E0
blue：11010000 十进制：208 十六进制：D0
黑色是世界上最纯洁的颜色 rgb(0,0,0) 0x000000
白色是世界上最复杂的颜色 rgb（255， 255，255）0xffffff
关于32bit 基于24bit 增加8个位的透明通道，可以表示带有透明度的颜色，比如CSS种rgba（255，0，0，0.5）表示50%透明度的红色
关于颜色数量：
如果位深度为n,那么没一个像素能显示2^n,所以位深度为24时 可以显示2^24种颜色 也就是16777216种颜色
24bit也被称作真彩色（True Color） 也就是常说24位真彩
位深度越大，能表示的颜色数量就越多图片也就越鲜艳，颜色过渡就会越平滑
图片格式：png jpg gif 统一叫位图 svg为矢量图
一张图片的大小是如何计算出来的？
假设一张图片的分辨率位60*50，位深度为24，所以：
每个像素的大小是 24bit(3字节 1字节 = 8bit) 每个像素用24位二进制来表达
图片的理论大小为 60 * 50 * （24 / 8）= 9000B ≈ 8.79kb
之所以比图片理论计算大小少，是因为在相同分辨率，相同位深度的前提下，把图片存成不同的格式（jpg png）都是经过压缩后的图片，所以他们的大小会比理论值偏小
图片的压缩类型可以分为2种：
1.无损压缩 （不损失图片质量，压缩率低，体积大，解压后能够还原原始图片数据，不会损失任何图片信息 ）
2.有损压缩 （会损失图片质量，压缩率高，体积小，解压后无法还原图片的原始数据， 会损失一些图片信息）
jpg jepg 有损压缩 24bit
png 无损压缩 8/24/32 bit
gif 无损压缩
当人眼看到的影像 消失以后，人眼仍能继续保持0.1s~0.4s左右，这种现象被称为视觉暂留现象，
我们使用的日光灯每秒大约熄灭100余次，但我们基本感受不到日光灯的闪动这都是因为视觉暂留现象，
在一帧图片消失在大脑之前呈现出下一张图片，反复如此，就可以形成连贯的动画效果
早期电影的帧率24fps
fps:每秒的帧数 Frames Per Second
帧数越多动画效果越好