CDN引入CSS必须放在<head>内且带完整HTTPS地址，否则页面白屏或闪动；只加CSS可显示样式但交互组件失效；推荐jsdelivr或BootCDN组合，本地需用HTTP服务而非双击打开。
CDN引入CSS必须放里，且不能少协议头
只加CSS不加JS，按钮、栅格、排版样式能用；但放错位置或协议缺失，页面就白屏或闪动。最常见错误是把<link>丢到<body>里，或者复制链接时带上了[、]、↗这类不可见字符。
-
<link rel="stylesheet">必须严格放在<head>内，早于<title>或<meta>都行，但不能被注释块、空格或换行隔开 - href值必须是完整 HTTPS 地址，例如：
https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css，不能写成cdn.jsdelivr.net/...或http://...（HTTPS 页面会拦截 HTTP 资源） - 控制台若报
GET https://127.0.0.1:5000/https://cdn net::ERR_ABORTED，基本就是 href 里混进了括号或 Markdown 链接格式
为什么只加CSS也能“看起来正常”，但交互组件全失效
Bootstrap 5 把样式和 JS 行为彻底拆开：CSS 负责外观，JS 负责下拉、模态框、折叠这些动作。只引入 CSS，btn btn-primary会变蓝，但data-bs-toggle="dropdown"点一下没反应——这不是 bug，是设计如此。
- 所有依赖 JS 的组件（
Dropdown、Modal、Offcanvas、Toast）在没加载bootstrap.bundle.min.js前，DOM 上的data-bs-*属性完全被忽略 - 浏览器不会报错，也不会警告，只是静默不执行——你得手动检查
document.querySelector('[data-bs-toggle]')是否存在，再确认bootstrap.bundle.min.js是否已加载并执行 - 如果只想要纯样式（比如做静态宣传页），那单加 CSS 完全够用；但凡有一点交互需求，就必须补上 JS
CDN地址选 jsdelivr 还是 BootCDN？国内访问怎么选
jsdelivr 全球节点稳定、同步快，适合多数场景；BootCDN 对国内用户首字节更快，但版本偶尔滞后。别混用——同一项目里 CSS 用 jsdelivr、JS 用 BootCDN，部分地区可能触发跨域或加载失败。
- 推荐组合（2026 年稳定可用）：
CSS：https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css
JS：https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js - 国内强延迟敏感场景可换 BootCDN：
CSS：https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.min.css
JS：https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.min.js - 无论选哪个，务必检查 Network 面板里两个请求状态码都是
200，且域名一致
本地双击 HTML 打不开？不是 CDN 的问题
双击打开index.html时，浏览器走file://协议，而 Bootstrap 的 JS 内部有动态资源加载逻辑，会被直接拦截或静默失败——模态框点不动、Tooltip 不出现，跟 CDN 链接无关。
立即学习“前端免费学习笔记（深入）”；
- 解决办法只有两个：
– VS Code 里右键用Live Server启动，地址变成http://127.0.0.1:5500/
– 或终端运行npx serve/python3 -m http.server - 别试图改
file://路径加localhost，也别在<script>里加type="module"，这些只会让问题更隐蔽 - 这个限制不是 Bootstrap 特有，所有依赖动态导入或 fetch 的前端库在
file://下都会出问题
