10. 常见图片的格式（jpg，png，gif，webp 以及各自的优势）

1. JPG（或 JPEG）

特点：

• 有损压缩：通过减少图像中的颜色和细节来减小文件大小，压缩比高，但会损失部分图像质量。
• 色彩丰富：支持 24 位颜色，适合存储色彩丰富的照片。
• 不支持透明度：无法实现图像的透明效果。

适用场景：

• 适用于照片和色彩丰富的图像，如风景照、人物照等。
• 适合在网页上使用，尤其是在需要减小文件大小以提高加载速度时。

2. PNG

特点：

• 无损压缩：在不损失图像质量的情况下减小文件大小，适合存储包含大量细节的图像。
• 支持透明度：可以实现图像的透明效果，适合需要背景透明的图像。
• 支持动画：PNG 本身不支持动画，但有扩展格式 APNG 支持简单的动画效果。 适用场景：
• 适用于需要透明背景的图像，如图标、徽标等。
• 适用于包含大量细节的图像，如屏幕截图、设计图等。

3. GIF 特点：

• 无损压缩：在不损失图像质量的情况下减小文件大小。
• 支持动画：可以实现简单的动画效果，适合制作简单的动画图像。
• 颜色限制：最多支持 256 种颜色，不适合存储色彩丰富的图像。 适用场景：
• 适用于简单的动画图像，如表情包、简单的动画广告等。
• 适用于颜色较少的图像，如图标、简单的图形等。

4. WebP 特点：

• 有损和无损压缩：支持有损和无损压缩，可以在较小的文件大小下保持较高的图像质量。
• 支持透明度和动画：支持透明度和简单的动画效果，适合多种应用场景。
• 现代浏览器支持：被现代浏览器广泛支持，但不被所有浏览器支持。 适用场景：
• 适用于需要在网页上使用高质量图像且文件大小较小的场景。
• 适用于需要透明背景和简单动画的图像。

1. 包含大量细节的屏幕截图： 选择：PNG 理由：PNG 支持无损压缩，可以保留图像的所有细节，适合存储屏幕截图等包含大量细节的图像。
2. 需要透明背景的图标： 选择：PNG 理由：PNG 支持透明度，可以实现图像的透明背景，适合制作图标等需要透明背景的图像。
3. 简单的动画表情包： 选择：GIF 理由：GIF 支持简单的动画效果，适合制作动画表情包等简单的动画图像。
4. 色彩丰富的风景照片： 选择：JPG 理由：JPG 支持 24 位颜色，适合存储色彩丰富的照片，且可以通过有损压缩减小文件大小，适合在网页上使用。