在1倍和2x之间选择时:
如果DevicePixelRatio< Firefox将加载2X 1
如果DevicePixelRatio< 1.5
不确定如何在Safari中进行测试,因为当我缩放网站时,
真的没有标准吗?至少在MDN上找不到任何文档或其他内容...我确定我不是唯一对此问题感兴趣的人。
我很好奇,因为我的图片在Chrome浏览器中看起来真的很糟糕。我看到的唯一解决方法是在X1.5像素密度描述符下使用X2图片。
注意:这是您可以在此处测试浏览器对此功能的行为的网站: https://webkit.org/demos /srcset/
When choosing between 1x and 2x:
Firefox will load 2x if devicePixelRatio < 1
Chromium will load 2x if devicePixelRatio < 1.5
Not sure how to test this in Safari as devicePixelRatio doesn't change when I scale website
Is there really no standard about this? Can't really find out any docs or something on MDN at least... I am sure I am not the only who is interested in this issue.
I am curious because my pictures look really bad in chrome browsers. The only workaround I see is using my x2 pictures under x1.5 pixel density descriptor.
Note: And this is website where you can test browser's behaviour about this feature: https://webkit.org/demos/srcset/
发布评论
评论(1)
A>指出,可以从
srcset
“以实现定义的方式”中选择图像源。您可以在撰写此答案的书写在这里。请注意说明其工作原理的评论:
至于,当设备像素比为&gt时; 1,它试图使用每对候选者的几何平均值尝试选择最接近设备像素比的几何平均值。
The
srcset
specification states that the image source may be chosen from asrcset
"in an implementation-defined manner".You can find the implementation of Gecko's (the rendering engine Firefox uses) source selection algorithm as of the writing of this answer here. Note the comment explaining how it works:
As for Blink (Chrome)'s implementation, when the device pixel ratio is > 1, it tries to use the geometric mean of each pair of candidates to try to select one that is nearest to the device pixel ratio.