css - CSS img srcset 纵向媒体查询

Question

我有两张图片，一张用于横向，一张用于纵向。

使用<picture>，我可以使用标准媒体查询，但<picture>Safari 不支持，所以我想使用<img srcset>. 我找不到任何信息，如何在srcset.

有什么帮助吗？

Answer 1

Safari 现在支持 <picture> 。这是为纵向和横向模式显示不同图像的代码。

<picture>
    <source media="(orientation: landscape)" srcset="landscape.jpg">
    <source media="(orientation: portrait)" srcset="portrait.jpg">
    <img src="fallback-image.jpg">
</picture>

Answer 2

你不能srcset用于艺术指导。改为使用<picture>和图片填充。