版权声明：本文为博主原创文章，转载时请注明出处。 https://blog.csdn.net/i_dont_know_a/article/details/82491960
通常网页在显示的图片（图形）的时候，有以下几种格式：GIF、PNG、JPG、SVG。
▍GIF
优点：GIF是动态的；支持无损耗压缩和透明度。
缺点：的详细的图片和写实摄影图像会丢失颜色信息；在大多数情况下，无损耗压缩效果不如 JPEG 格式或 PNG 格式；GIF 支持有限的透明度，没有半透明效果或褪色效果。
适用场景：主要用于比较小的动态图标。
▍PNG
优点：PNG格式图片是无损压缩的图片，能在保证最不失真的情况下尽可能压缩图像文件的大小；图片质量高；色彩表现好；支持透明效果；提供锋利的线条和边缘，所以做出的logo等小图标效果会更好；更好地展示文字、颜色相近的图片。
缺点：占内存大,会导致网页加载速度慢；对于需要高保真的较复杂的图像，PNG虽然能无损压缩，但图片文件较大，不适合应用在Web页面上。
适用场景：主要用于小图标或颜色简单对比强烈的小的背景图。
▍JPG
优点：占用内存小，网页加载速度快。
缺点：JPG格式图片是有损压缩的图片，有损压缩会使原始图片数据质量下降，即JPG会在压缩图片时降低品质。
适用场景：由于这种格式图片对色彩表现比较好，所以适用于色彩丰富的图片。主要用于摄影作品或者大的背景图等。不合适文字比较多的图片。
▍SVG
优点：SVG是矢量图形，不受像素影响，在不同平台上都表现良好；可以通过JS控制实现动画效果。
缺点：DOM比正常的图形慢，而且如果其结点多而杂，就更慢；不能与HTML内容集成。
适用场景：主要用于设计模型的展示等。