CSS 应放在 中，不可置于 内；否则引发 FOUC、样式丢失、SEO 问题； 需按重置、框架、自定义顺序排列；禁用 @import 和动态插入；构建工具输出也需校验。
css 应该放在
浏览器解析 HTML 是从上到下流式进行的。如果把 放在 里（哪怕只是开头），会导致：页面先无样式渲染一次（FOUC，Flash of Unstyled Content），再重绘；部分 CSS 选择器（如 @import 在 块中）可能被忽略；SEO 工具和部分爬虫无法正确提取样式上下文。
标准写法是紧贴 起始标签之后、
我的页面 ...
多个
CSS 是“渲染阻塞资源”——浏览器会暂停 HTML 解析，直到所有 加载并解析完成。因此顺序直接决定：
- 后加载的 CSS 规则可覆盖前面同权重的选择器
- 若前一个 CSS 文件网络失败或超时，后续 CSS 和 JS（在它之后的）可能被延迟执行
- 不要把第三方 CSS（如 CDN 上的 Bootstrap）放在自定义 CSS 后面，除非你明确想覆盖它的默认样式
典型安全顺序：
立即学习“前端免费学习笔记（深入）”；
避免在
虽然 JS 可以用 document.head.appendChild() 插入 ，但这不会触发浏览器的“阻塞式解析”，而是异步加载，导致：
- 样式应用滞后，用户看到闪动或错位布局
-
getComputedStyle()在插入后立即调用可能取不到预期值 - 媒体查询（
media="print"等）可能不生效
如需条件加载（比如暗色模式切换），应使用 media 属性配合 JS 切换 disabled 状态，而不是增删节点：
然后 JS 控制：document.getElementById('theme-css').disabled = true;
内联 @import 的位置陷阱
块必须也在 中，否则 HTML 不合法（验证器报错），且多数浏览器会自动将其移到 ，但行为不可靠。
更危险的是在 块里用 @import：
-
@import必须出现在块最前面，否则无效 - 它会引发额外 HTTP 请求，并且是串行阻塞的（比
更慢） - 不支持
media属性的早期写法（如@import url(x.css) screen and (min-width:768px)）在旧版 Safari 中有兼容问题
结论：不用 @import，全部改用 。
