为什么图像质量随着分辨率的提高而提高？

Question

我的HTML文档中有一个img元素，其宽度约为100像素。

将源设置为每次更改的不同宽度的图像时的输出：

17000像素：

2000像素：

500像素：

100像素：

如您所见，即使img元素的宽度恒定为100px，图像的质量也会降低。这背后有什么原因吗？如果是这样，应采取哪些措施来确保质量还不错？

Answer 1

您是否将这些作为屏幕截图？我认为图像看起来不太清晰，因为显示时分辨率较低。同样，在监视器上显示图像的区域的分辨率低于图像本身的分辨率。因此，通过使显示的区域更大，您的监视器可以更准确地显示图像。

这样想：在720p显示器上显示4K墙纸效果不佳，因为显示器必须按比例缩小。

与浏览器图像大小调整相关的阅读内容：https://petapixel.com/2009/11/12/why-you-should-never-let-browsers-resize-your-photos/