多列布局中的srcset响应图像

时间:2018-02-14 00:17:57

标签: html5 multiple-columns srcset

我在html文章中有图像,使用包含div的固定列宽属性设置为列。

我为sonsset添加了srcset,它可以很好地工作,除了它根据包含div的宽度加载最大的图像而不是基于列宽度的较小图像。

在某些情况下,文章显示没有列,所以我希望相同的图像srcset可以满足这两种情况。是否有任何方法可以让srcset选择较小尺寸的图像,当它显示固定的列内容?

1 个答案:

答案 0 :(得分:0)

由于缺乏响应,我想出了在图像周围包装div,以便div扩展到列,并根据包装器而不是完整的div选择srcset picks图像。如果有人有更好的解决方案,请分享。

更新:不能正常工作,因为srcset会查看视口而不是包装div。解决这个问题的一种方法可能是使用30vw的大小,如果它在多列中,或者使用包含div的宽度计算列数,并将该值用作大小的vw量。