理解srcset宽度值

Question

我试图了解srcset宽度值是如何工作的，但是我所举的基本示例是放弃我。

考虑到下面的代码，我希望当viewport >600 is时显示大图像。然而，它实际上在784 at时发生了变化。我不知道这是为什么。

<!-- image changes to large variant at 784px instead of the expected 1024px -->
<img
  src="small.jpg"
  srcset="small.jpg 600w,
          large.jpg 1024w"
  alt="A test image">

Answer 1

目前，Chrome使用几何平均值在两个图像候选点之间进行选择。因此，它仍然使用600图像，因为1024太大，因此切换。

在即将发布的版本中，如果你有一个低密度的设备，Chrome将始终切换到更高的映像。在其他设备上，Chrome仍将使用一个中位数。