<link rel="stylesheet"> 必须写在 <head> 中，否则会导致页面闪白、无样式或脚本阻塞；路径需正确（正斜杠、相对/绝对路径规范）；media 和 disabled 属性有实际用途但易误用；服务器必须返回 Content-Type: text/css，否则样式静默失效。
<link> 标签是 HTML 中引入外部 CSS 的标准方式，只要位置、属性和路径写对，浏览器就能加载样式；写错则页面无样式或控制台报 404。
为什么 <link rel="stylesheet"> 必须写在 <head> 里
浏览器解析 HTML 是从上到下流式进行的。如果把 <link> 放在 <body> 底部，CSS 文件还没加载完，HTML 元素已渲染（可能闪白屏或无样式），且部分浏览器会阻塞后续脚本执行直到样式表就绪。
- 必须放在
<head>内，紧贴<title>后或<meta>后均可 - 不能用
<link rel="import">或<script>加载 CSS —— 这些不是标准用法，现代浏览器不支持 -
rel="stylesheet"缺一不可，写成rel="style"或漏掉都会被忽略
href 路径写错的三种典型表现
路径错误不会报语法错，但控制台会出现 Failed to load resource: the server responded with a status of 404 ()，页面无样式。
- 相对路径以当前 HTML 文件为基准：HTML 在
/pages/index.html，CSS 在/css/style.css，则写href="../css/style.css" - 根目录路径用
/开头：CSS 在/assets/main.css，无论 HTML 在哪层，都写href="/assets/main.css" - 别用 Windows 风格反斜杠：
href="css\style.css"❌，必须用正斜杠href="css/style.css"✅
media 和 disabled 这两个属性真有用吗
它们不是摆设，但在日常开发中容易被忽略或误用。
立即学习“前端免费学习笔记（深入）”；
-
media="print"可让某份 CSS 只在打印时生效，避免干扰屏幕样式；media="(max-width: 768px)"能做响应式加载（但更推荐用@media规则写在单个 CSS 里） -
disabled="disabled"可临时禁用某条样式表（比如调试时快速对比），但 JS 修改disabled属性后需手动触发重绘，不如直接移除<link>节点可靠 - 不要滥用
onload：虽然可以监听加载完成，但<link>不原生支持onload事件（Chrome 支持，Firefox 不支持），应改用addEventListener('load', ...)
最容易被跳过的其实是 MIME 类型 —— 服务器返回 CSS 文件时，响应头必须是 Content-Type: text/css，否则即使路径全对，Chrome 也会静默拒绝应用样式，且不报明显错误。
