渐进增强与优雅降级
渐进增强（Progressive Enhancement）：先保证所有设备都能用的基础体验，再给现代浏览器叠加高级效果。优雅降级（Graceful Degradation）相反：先做完整版，再给旧浏览器写补救补丁。
两者目标相同（全设备可用），起点不同。现代实践普遍选渐进增强：HTML 语义化做骨架 → CSS 基础样式 → 增强（动画、新布局）→ JS 增强（交互）。即使 JS 被禁用，内容仍可读。
- 渐进增强：基础 → 增强，向下兼容的起点
- 优雅降级：完整 → 打补丁，适合已有系统改造
- 关键原则：内容与核心功能必须在最差环境下可用
HTML
<!-- 渐进增强示例：无 JS 也能提交的表单 --> <form action="/search" method="get" id="searchForm"> <input type="search" name="q" required> <button type="submit">搜索</button> </form> <script> // 有 JS 时增强：回车/输入即时搜索，无 JS 时走原生表单提交 var form = document.getElementById('searchForm'); if (form && CSS.supports('selector(:focus-visible)')) { form.addEventListener('submit', function (e) { e.preventDefault(); console.log('增强：AJAX 搜索'); }); } </script>
本节要点渐进增强 = 基础体验人人可用 + 高级体验按能力叠加；与 @supports 配合食用最佳。
