Html 如何使用不同的dpr调试srcset？

我已经决定将我的网站改为使用

srcset

来处理低dpi屏幕的图像。我的网站图片很多，默认的400x400缩略图在hidpi屏幕上看起来非常漂亮。在lodpi屏幕上，显示图像的实际大小是165x165，这是一种过分的做法。更改后，my

img

元素大致如下所示：

/tiny/

图像为170x170，

/thumb/

图像为400x400。果不其然，在hidpi屏幕上加载一个包含这些内容的页面可以得到400x400版本。显示浏览器看到

srcset

并相应地操作。我在Firefox中调出开发工具，启用“响应设计模式”

，将“屏幕”大小更改为300x700，设备像素比为1.0，然后重新加载页面。它仍然使用

/thumb/`版本，即使页面上的图像现在是120x120，并且dpr为1.0，没有必要调低400x400图像

我对它做了一些修改，但是我找不到一个好的选择图片的答案。我很确定我在这里遗漏了一些东西：|