说我有以下图像：
<img src="//picsum.photos/100" srcset="//picsum.photos/100 100w">
我似乎没有包含的sizes属性默认值为100vw，因此，小图像会放大到视口的宽度。
如果我不希望这种行为，而是希望图像默认使用其固有尺寸，该怎么办？
我希望该图像在正常显示器上的宽度默认为100px，在2x（视网膜）显示器上的宽度默认为50px。
如果我将自己的sizes属性指定为100px，则不能解决在视网膜显示器上将其显示在50px上的问题。
我需要此行为的原因是，在我的系统中，允许用户上传任意大小的图像并将其放置在页面上，并且我正在生成一个srcset，该过程分多个步骤进行，直至达到其最大大小图片，并且我需要一种方法，根据图片的大小和用户屏幕的像素密度，以正确的宽度显示图片。
使用srcset是否可以实现自动宽度图像的这种行为？
在我的研究中，我发现this article直接解决了这个问题。作者建议将width属性添加到图像的最大大小，以将sizes属性执行的操作恢复为图像的固有大小。但是，他没有解决如何以不同的像素密度进行这项工作。
答案 0 :(得分：1)
不幸的是，考虑到DPR，似乎没有办法将srcset的图像默认设置为自然尺寸。 sizes属性，如果未在具有100vw的图像上设置，则默认为srcset，它重新定义了图像的固有宽度，并且似乎没有一种方法可以在不提供该属性的情况下进行重置自己明确的宽度。
在我的特定情况下，我发现我们已经将用户的DPR存储在cookie中，因此在服务器端，我已经开始将图像上的width属性设置为图像的最大宽度除以用户的DPR。这样可以防止显示的图像大于原始大小，并确保为具有高像素密度的设备调整图像的大小。
当然，您可能希望将其与CSS中的max-width: 100%;结合使用，以防止图像显示得比容器大。
示例解决方案：
<!-- Width generated server-side for standard displays: -->
<img src="//picsum.photos/100" srcset="//picsum.photos/100 100w" width=100>
<!-- Width generated server-side for displays with a DPR of 2: -->
<img src="//picsum.photos/100" srcset="//picsum.photos/100 100w" width=50>