HTML外部样式表必须通过<link rel="stylesheet" href="路径">在<head>中引入，确保渲染前加载、避免FOUC；rel和href缺一不可，路径须相对于HTML文件且大小写敏感。
HTML 外部样式表通过 <link> 标签引入，核心是写在 <head> 里、带对属性、路径写准。
必须放在 <head> 里
浏览器按顺序解析 HTML，<link> 放在 <head> 才能确保样式在内容渲染前加载。如果误放进 <body>：
- 可能触发 FOUC（无样式内容闪现），页面先白屏再上色
- IE6–8 会直接忽略，样式完全不生效
- 部分脚本执行可能被阻塞或重绘异常
关键属性一个都不能少
<link> 至少要包含两个必需属性：
-
rel="stylesheet"：告诉浏览器这是样式表，拼错（如
rel="style"）或漏掉，浏览器就当它不存在 -
href="路径"：路径必须用英文引号包裹，比如
href="style.css"；不加引号在某些环境下会解析失败
type="text/css" 在 HTML5 中已可省略，写了不报错但没必要。
立即学习“前端免费学习笔记（深入）”；
路径怎么写才不出错
href 的路径是相对于当前 HTML 文件的位置，不是相对于 CSS 文件，也不是相对于网页 URL：
- 同目录：
href="style.css" - CSS 在 css/ 子文件夹：
href="css/style.css" - HTML 在 /pages/index.html，CSS 在 /css/base.css：
href="../css/base.css" - 不确定时优先用绝对路径：
href="/assets/css/main.css"（从网站根目录算起）
服务器区分大小写，Style.css ≠ style.css；404 报错基本就是路径或文件名错了。
多个样式表的加载顺序很重要
浏览器按 <link> 在 HTML 中出现的顺序加载 CSS，后加载的同权重规则会覆盖前面的：
- 建议顺序：重置样式 → 通用组件 → 页面专属 → 覆盖补丁
- 调试时发现改了没反应，先检查是不是被后面某个
<link>覆盖了 - 别用
@import在 CSS 里导入其他 CSS，它会阻塞渲染且无法并行下载
