HTML兼容旧浏览器的核心是通过polyfill补全JavaScript API和CSS行为，而非改变HTML标签本身；需用html5shiv使IE8识别语义标签并配合display:block样式，fetch等API需whatwg-fetch或polyfill.io，Flexbox/Grid等CSS特性须手动适配旧语法，降级策略优先于polyfill，确保HTML裸跑可用。
HTML本身没有“polyfill”概念，真正要抹平的是JavaScript API和CSS行为的鸿沟。所谓兼容旧浏览器，核心不是让HTML标签变“新”，而是让依赖这些标签的新API、新语法、新布局能力，在旧环境里能跑起来——这靠的是精准引入polyfill、合理降级、以及结构兜底。
语义标签得先“被看见”，再谈样式与交互
IE8及更早版本压根不解析<header><main><section>这类标签，DOM里根本没节点，CSS写header { display: block; }也无效。光靠CSS不行，光靠document.createElement('header')也不够。
- 必须在<head>最顶部、任何样式或脚本加载前，用条件注释只给IE8-引入html5shiv：
<!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script><![endif]--> - 同时必须显式声明样式：
article, aside, footer, header, main, nav, section { display: block; }，这段CSS要放在所有自定义样式之前 - 注意：html5shiv只解决“渲染存在”，不解决ARIA语义支持，屏幕阅读器仍可能忽略<main role="main">这类写法
关键API缺失，得用对应polyfill按需补上
fetch、Promise、classList、IntersectionObserver这些不是语法问题，Babel转译不了，必须靠运行时模拟。
- fetch全IE缺席：推荐whatwg-fetch，但必须放在所有业务脚本最前面加载，禁用
async或defer，否则会报fetch is not defined - Polyfill.io是更轻量的选择：用
<script src="https://polyfill.io/v3/polyfill.min.js?features=fetch,Promise,Element.prototype.classList"></script>，它根据User-Agent动态返回缺失部分，Chrome可能返回空，IE11则带完整实现 - Canvas.toBlob不支持IE10+？用
canvas-toBlob库，它纯JS实现数据流转，不依赖原生API，上传或本地保存场景可直接替换
布局与CSS特性不能只靠autoprefixer
autoprefixer只加前缀，不解决“有无”问题。IE10–11的Flexbox是旧草案语法，Safari 13.1以下不支持aspect-ratio，position: sticky在iOS Safari需JS模拟——这些都不是加-webkit-能搞定的。
立即学习“前端免费学习笔记（深入）”；
- Flexbox兼容：Autoprefixer需配置
browserslist: ["ie >= 10"]，并手动补全旧属性，如display: -ms-flexbox; -ms-flex-pack: center; - Grid布局在IE中行为差异太大，autoprefixer默认不生成
-ms-grid，建议基础层用float/inline-block，增强层才用Grid - sticky定位可用
stickybits或ismobilejs，它们监听滚动、动态计算top值，比纯CSS更可控
降级策略比polyfill更重要
polyfill是锦上添花，结构和流程兜底才是底线。一个表单没有action和method，JS提交失败就彻底卡死；nav里用div拼菜单，IE11键盘Tab无法聚焦链接。
- HTML必须裸跑可用：去掉CSS和JS后，页面仍能读、能导航、能提交。这是渐进增强的起点，不是加分项
- 避免伪元素承载关键信息：
::before在IE11不渲染，屏幕阅读器也读不到，图文核心内容必须写在HTML里 - 图片alt不能为空，若承载关键信息，alt中要完整描述，或在邻近
<p>中重复说明 - @supports不是浏览器开关，而是能力检测开关。别写
@supports (display: grid) { ... }重排整个布局，应限定在微调间距、对齐等不影响流的属性上
