必须用放在中且置于所有自定义css之前，否则重置失效；因其阻塞渲染以构建cssom，放会导致fouc、hydration mismatch及首屏不可靠，顺序错或rel/路径错误均静默失败。
必须用 <link rel="stylesheet"> 放在 里，且顺序要在所有自定义 CSS 之前，否则重置失效。
为什么 <link> 必须放在
浏览器流式解析 HTML，遇到 <link rel="stylesheet"> 会阻塞渲染，等 CSSOM 构建完才继续。放 里会导致 FOUC（页面先裸奔再闪样式），旧版 IE 直接忽略；SSR 或 Vue/Next.js 项目还会触发 hydration mismatch。不是“看起来能用”，而是首屏布局、媒体查询、字体加载全不可靠。
modern-normalize.css 的引入路径和 CDN 写法
推荐两种可靠写法，都以根相对路径或绝对 URL 为准：
-
<link rel="stylesheet" href="/node_modules/modern-normalize/modern-normalize.css">（本地 node_modules，需确保构建工具能处理该路径） -
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/modern-normalize@latest/modern-normalize.css">（CDN，免路径烦恼，但注意 SRI 可选校验）
别写 ./css/normalize.css 或 ../reset.css——点斜杠多余，层级一变就断；Linux 服务器上 Modern-Normalize.css ≠ modern-normalize.css，大小写错直接 404。
重置样式表必须排在所有自定义 CSS 之前
重置的作用是“设底限”，靠声明顺序和优先级压制浏览器默认样式。如果 base.css 或 main.css 在 <link> 前就加载，哪怕只有一行 * { box-sizing: border-box }，也可能因选择器权重或解析时机跳过重置里的同名规则。
正确顺序示例：
<title>My App</title><!-- 重置必须最前 --><link rel="stylesheet" href="/css/modern-normalize.css"><!-- 框架次之 --><link rel="stylesheet" href="/css/bootstrap.min.css"><!-- 自定义最后 --><link rel="stylesheet" href="/css/main.css">
常见静默失败点：rel 和路径不严格等于白写
rel="stylesheet" 漏写、拼成 rel="style"、rel= stylesheet（缺引号）、rel="stylesheet "（末尾空格），浏览器都不当样式表处理——Network 面板里压根没请求，Elements 面板 Styles 栏为空，控制台零报错。路径写错也一样静默：打开 Network 面板，看 “Initiator” 列定位哪个 <link> 发起了 404，右键 href 值 → “在新标签页打开”，能看见 CSS 内容才算通。
真正容易被忽略的，从来不是“要不要重置”，而是 rel 属性的字母一个不能少、路径开头那个 / 一个不能省、顺序上它必须是 里第一个样式链接。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
