我阅读了几个关于该主题的问题，我看到的一般反馈是 JPG 用于照片，PNG 用于其他所有内容:
PNG should be used when:
- You need transparency (either 1-bit or alpha transparency)
- Lossless compression will work well (such as for a chart or logo, or computer generated image)
JPEG should be used when:
- Lossless compression will not work well (such as a photograph)
- Full color is needed
GIF should be when:
- PNG is not available, such as on very old software or browsers
- Animation is necessary
但是，这些讨论似乎更适合图像下载。我的问题更适合图像渲染。我打算在 x 和 y 方向上重复一个背景...
background-image: url("/path/to/image.jpg"); /* repeat-x & repeat-y */
...我可以将图像存储为 JPG ~13K 或 PNG ~50K。因此，尽管存在约 40K 的差异，但浏览器将能够相当快地提取此图像，因为它相对较小。但是，当浏览器在页面上呈现图像时，这种差异是否重要，尤其是因为它具有重复的背景？
最佳答案
JPG 更适合低带宽图像 - 但它不够清晰，因此不太适合 GUI。
JPG 文件可以保存为更小的文件大小，从而实现更快的交易和在线交付。
JPG 可以保存为不同的压缩级别(通常为 1 - 12，12 是更高的质量)。
PNG 更适合色彩较少的清晰图像，
PNG 支持 100% 透明度。无需保存到 PSD(Photoshop 文档)以保持透明度。
PNG 支持具有基本效果和格式的图层
您可以继续保存完全相同的 PNG 文件，而不必担心每次都会降低图像质量。
一般来说，JPG 用于照片和图片，而 PNG 适用于计算机生成的图形、 Logo 、网络图标等。
关于css - 我应该使用 JPG 还是 PNG 作为平铺背景(背景重复)？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10135435/