图片知识
- 栅格图（位图）：由一个个像素拼凑而成
- 常见类型：png/jpg/webp/gif
| 扩展名 | 色彩支持 | 透明度 | 动画 | 压缩 | 最佳用途 |
|---|---|---|---|---|---|
| .gif | 每像素8位：256种颜色 | 1位透明度，像素要么透明要么不透明 | ✅ | 无损压缩，文件大小较大 | 较小的图形，颜色有限，短动画 |
| .jpg, .jpeg | 每通道8位：1600万+种颜色 | 不支持透明度 | ❌ | 有损压缩，文件大小较小 | 全彩照片 |
| .png, .apng | 每通道8 位：1600万+种颜色 | 支持完全半透明 | ✅ | 无损或接近无损压缩，更好的质量 | 含有文本的图形和设计 |
| .webp | 每通道8位：1600万+种颜色 | 支持完全半透明 | ✅ | 有损压缩，文件大小较小 | Web图像，尤其是照片 |
- 矢量图：由坐标系和点、线、曲线组成
- 常见类型：svg
- 位图vs矢量图：
- 位图能表现更多色彩
- 矢量图牺牲了色彩细节