Bootstrap 5 通过属性名变更（如 data-toggle→data-bs-toggle）和 CSS 变量实现降级，旧浏览器静默失效或回退默认样式，不报错但需手动补 fallback；JS 组件弃用 jQuery，不支持 IE10 及更早版本。
data-bs-* 属性不升级，旧版浏览器直接“静默失效”
Bootstrap 5 的降级不是靠“自动适配”，而是靠“属性名写错就彻底不工作”——它不会报错，也不会 fallback，按钮点不动、菜单不展开、模态框打不开，控制台一片安静。这是最常被误判为“兼容性问题”的实际配置错误。
- 旧代码里还留着
data-toggle="modal"？立刻替换成data-bs-toggle="modal" -
data-target="#nav-menu"必须改为data-bs-target="#nav-menu"，否则 Navbar 折叠按钮形同虚设 -
data-dismiss="modal"同理 →data-bs-dismiss="modal"，连关闭 × 按钮都点不了 - 检查 CDN 引入的是
bootstrap@5.x，但文档/示例抄的是 v4 官网？90% 的“不显示”都卡在这一步
CSS 变量（--bs-*）天然支持优雅降级
Bootstrap 5 大量依赖 CSS 自定义属性（如 --bs-body-color），好处是：不支持 CSS 变量的浏览器（如 IE11 及更早）会直接忽略它们，退回到预设的硬编码值或浏览器默认样式，而不是崩溃或白屏。
- 深色模式用
data-bs-theme="dark"开启？IE11 根本不认识这个属性，也读不懂--bs-body-bg，但它仍能显示基础浅色界面 - 不用额外 polyfill 或条件注释来“兜底”CSS 主题，变量失效即回归默认，这就是设计层面的降级保障
- 但注意：如果你在自定义 CSS 中写了
color: var(--bs-primary);，而没提供 fallback 值（如color: #0d6efd;），IE11 就会渲染成 inherit 或初始色，需手动补
JS 组件无 jQuery 依赖，但也不兼容太老环境
Bootstrap 5 彻底移除了 jQuery，改用原生 DOM API 和 ES6+ 语法。这意味着它放弃了 IE10 及更早版本，但对 IE11 和 Safari
- IE11 能跑基础组件（如 Collapse、Modal），但部分新特性（如
ResizeObserver、Promise.allSettled）需自行 polyfill - Safari 11 或更早？直接不保证可用——官方已明确将最低支持定为 Safari 12
- 别指望
bootstrap.bundle.min.js自带所有兼容层；它只含 Popper，不含core-js或webcomponents.js - 若必须支持 IE11，建议在构建流程中加入 Babel + targets: { ie: "11" }，并手动引入
resize-observer-polyfill
文件上传、下拉等插件需单独验证兼容行为
像 bootstrap-fileinput 或 bootstrap-select 这类第三方增强组件，其降级逻辑不由 Bootstrap 本身控制，得看各自实现。
-
bootstrap-fileinput对 IE11 做了专门处理：禁用文件夹拖拽、优化图片内存释放，但预览仅支持 JPEG/PNG，WebP 直接跳过 -
bootstrap-select的优雅降级靠noscript+ CSS：把.selectpicker默认设为display: none，再用noscript .selectpicker { display: block; }确保 JS 失效时原始<select>可见 - 别假设“用了 Bootstrap 5 就等于全兼容”——插件是否支持，得查它的 CHANGELOG，比如 IE11 文件夹拖拽修复就明确记录在
CHANGE.md里
实际项目里最容易被忽略的，是把“浏览器兼容”当成框架自动解决的事。Bootstrap 5 的降级策略其实是分层的：属性名错了，JS 组件直接哑火；CSS 变量不支持，视觉回退但页面不崩；JS 语法超纲，就得你来补。它不兜底，只划线。
