如何解决WEBP 支持使用 <picture> 的旧浏览器
我正在使用以下代码,希望能支持 IE11 和 Safari (iOS11)。所需的行为是在支持 ita 的浏览器上加载 WEBP 图像,在 IE11/iOS11(不支持 WEBP 的情况下)加载 PNG。我在这里使用(稍微)类似的 answer 作为参考.
<picture>
<source srcset="image.png" type="image/png">
<source srcset="image.webp" type="image/webp">
<img src="image.png">
</picture>
解决方法
如果要在Chrome中显示webp图片,在IE11中显示png图片,则需要首先放置webp源。您可以参考以下代码,它在 IE 11 中显示玫瑰(png 图像),在 Chrome 中显示树(webp 图像):
<picture>
<source type="image/webp" srcset="https://www.gstatic.com/webp/gallery/4.sm.webp">
<source type="image/png" srcset="https://www.gstatic.com/webp/gallery3/1.sm.png">
<img src="https://www.gstatic.com/webp/gallery3/1.sm.png">
</picture>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。