css - 要在 4 图像行中正确使用 SRCSET，我应该将宽度声明为 100% 行还是 1/4？

Question

我正在尝试使用 srcset 来优化加载速度/分辨率，并且有两件事要确认。

假设我在一行中使用 4 个图像，我应该在 srcset 内以全行宽度（比如 800w、1600w、2400w）还是 1/4 行宽（200w、400w、600w）宣布图像宽度。我一直在 codepen 中进行测试——> https://codepen.io/abc-analytics/pen/GRpVyvO 在我看来，每个图像的宽度都假定为 100% 的行，而不是渲染时的实际宽度。所以我应该把宽度写成实际大小的 4 倍，比如

srcset="/image_200px 800w, /image_400px 1600w, /image_600px 2400w" 

有人可以确认吗？

一个后续问题，当在 srcset 或 css 图像集中使用 1x 2x 3x 时，浏览器是否会下载 1x 图像并检查其大小，然后决定在提供的列表中实际使用哪个图像？所以如果浏览器想要一个 2000x1000 的图像，它首先下载并发现 1x 是 500x250，然后它会去 4x 图像（如果有的话）？

标签： cssresponsive-designresponsive-imagessrcsetimageset