src属性是唯一可靠fallback入口，老旧浏览器（IE8–IE11、Android 4.3前WebView）完全忽略srcset和sizes，仅加载src指向的真实可用图片。
srcset 本身不提供“错误降级”，它只做资源选择；真正能 fallback 的只有 src 属性——老旧浏览器（IE8–IE11、Android 4.3 前 WebView）完全忽略 srcset 和 sizes，只加载 src 指向的图。别指望它自动切备用图，那是 <picture></picture> 或 onerror 的事。
srcset + sizes 不生效？先看 sizes 写对没
现代浏览器用 sizes 算出“这张图在页面里实际占多宽”，再结合 srcset 里的 w 描述符选最匹配的源。没 sizes，浏览器就按默认 100vw 猜，大概率选错图甚至整个 srcset 被跳过。
- 必须写单位：
sizes="(max-width: 768px) 100vw, 50vw"合法，sizes="50%"或sizes="400"无效 - 值要和 CSS 布局对齐：如果图片容器
max-width: 600px，但sizes写成"(max-width: 768px) 100vw"，小屏下仍会拉大图 - 最后一项建议写绝对值兜底，比如
"(max-width: 480px) 100vw, 320px"，避免旧 Safari fallback 到100vw
srcset 里混用 w 和 x 描述符直接失效
浏览器看到 srcset="a.jpg 400w, b.jpg 2x" 这种写法，会整条丢弃 srcset，退化为只读 src。这不是兼容性问题，是规范行为。
- 用
w：适配布局宽度，必须配sizes，适合 banner、正文图等流式场景 - 用
x：适配设备像素比（DPR），sizes可省略，适合固定尺寸图标、头像 -
1x、2x必须写整数，1.0x或2.0x不被识别 - 即使只用
x，src也必须存在——它是 IE11 及更老环境的唯一入口
IE8–IE11 中 srcset 怎么保证有图可加载
这些浏览器解析 HTML 时，直接跳过 srcset 和 sizes 属性，连语法校验都不做。它们只认 <img src="..." alt="HTML图片srcset怎么降级？老旧浏览器适配指南" >，且 src 值不能是空、"#"、相对路径易 404 的地址，或带查询参数的动态 URL（如 logo.jpg?format=webp）。
立即学习“前端免费学习笔记（深入）”；
-
src必须指向一个真实可访问的静态图，推荐 CDN 托管的 JPG/PNG，比如https://cdn.example.com/logo-800w.jpg - 禁止写
./images/logo.jpg：嵌套路由下极易 404；也别写/images/logo.jpg?x-oss-process=resize：部分老 WebView 对带参 URL 返回 406 - 如果要用 JS 补救，
onerror必须内联并切断循环：onerror="this.src='/fallback.png'; this.onerror=null;" - 更稳的做法是直接内联 base64 占位图：
onerror="this.src='data:image/svg+xml;base64,...'; this.onerror=null;"
想用 WebP/AVIF 又要兼容老浏览器？别只靠 srcset
srcset 不处理格式兼容，它只挑分辨率/DPR 匹配的图——哪怕你 srcset 里全写 .webp，IE 也会因不支持格式而加载失败，只剩空白。真要格式降级，必须用 <picture></picture> 显式声明 type 优先级。
- 顺序即能力梯度：
<source type="image/avif"></source>→<source type="image/webp"></source>→<img src="fallback.jpg" alt="HTML图片srcset怎么降级？老旧浏览器适配指南" > -
type必须写标准 MIME 类型：image/avif，不是avif或.avif - 服务器返回的 WebP 文件，响应头
Content-Type必须是image/webp，否则浏览器校验失败，跳过该<source></source> -
<img alt="HTML图片srcset怎么降级？老旧浏览器适配指南" >的src是强制子元素，不是可选项；它的路径必须静态可用，且不能带查询参数
最容易被忽略的点：所有降级逻辑都依赖“路径真实可访问”。本地开发时 src="logo.jpg" 看似正常，一上生产，CDN 配置漏了缓存规则、OSS 权限没开、或者路径大小写不一致，src 就 404——这时连 IE 都没得救。验证时别只看渲染，一定去 Network 面板确认请求状态码和返回内容。
