全屏响应图像标记

时间:2015-02-09 11:25:41

标签: image responsive-design retina

我正在尝试找出最佳和最简单的方法来创建支持视网膜屏幕的全屏图像,并且还涵盖从大型桌面到手机的屏幕尺寸。图像始终以所有宽度填充视口。在我看来,最简单的方法是创建一个范围大小的图像,从桌面屏幕(用于桌面视网膜)的像素宽度加倍到手机屏幕的宽度,然后在srcset下列出所有图像。让浏览器弄清楚,并且大概是因为img总是全宽我不需要打扰尺寸属性?     

这是最好的方法吗?

1 个答案:

答案 0 :(得分:0)

简而言之,是的,但您仍应使用sizes属性。现在需要它,但您只需将其设置为:sizes="100vw"