前言
关于图片img的响应属性srcset,和sizes及picture,很久之前看过,但是因为浏览器兼容原因,一直没有在项目中使用,但是最近发现,这几个属性兼容性还可以了,可以去caniuse中看一下,基本可以在项目中使用了。今天,简单介绍一下这几个属性。
srcset 和 sizes 属性
srcset 是一个包含一个或多个源图的源图容器,不同源图用逗号分隔,每一个源图由下面两部分组成:
1、图片 URL
2、 x (像素比描述)或 w (图片像素宽度描述)描述符(与图片 URL 相隔一个空格), w 描述符的加载策略是通过 sizes 属性里的声明来计算选择的