小编Mar*_*rry的帖子

如何使用图片标签的后备 - Safari Webp

我正在使用如下代码:

<picture class="image-holder">
    <source srcset="some_img.webp" media="screen and (max-width: 1200px)">
    <source srcset="some_img.webp" media="screen">
    <source srcset="some_img.jpg" media="screen and (max-width: 1200px)">
    <source srcset="some_img.jpg" media="screen">
    <img srcset="default_img.jpg" alt="">
</picture>
Run Code Online (Sandbox Code Playgroud)

我希望当像某些版本的 Safari 这样的浏览器不支持 Webp 图像格式时,根据媒体查询回退到以下源,而不是直接到 "default_img.jpg" 。

但取而代之的是,我得到的是直接后备:

<img srcset="default_img.jpg" alt="">
Run Code Online (Sandbox Code Playgroud)

有谁知道我做错了什么?

html safari fallback webp picturefill

4
推荐指数
1
解决办法
2759
查看次数

标签 统计

fallback ×1

html ×1

picturefill ×1

safari ×1

webp ×1