link 标签引入外部 CSS 文件最常用，但路径写错就 404
浏览器加载 HTML 时，link 是默认阻塞渲染的，所以它得放 里，而且路径必须对。相对路径容易出错——比如 HTML 在 /pages/index.html，CSS 在 /css/style.css，那 href 就得写 ../css/style.css，不是 ./css/style.css。
- 检查浏览器开发者工具的 Network 面板，看 CSS 请求是否显示
404或blocked - 用绝对路径更稳：以
/开头（如/css/main.css），从站点根目录算起 - 别漏掉
rel="stylesheet"，少了这个，浏览器根本不当它是样式表 -
type="text/css"在现代 HTML 中可省，加了也不报错，但纯属冗余
style 标签写内联 CSS 简单，但无法复用且影响维护
把 CSS 直接塞进 <style></style> 标签里，适合临时调试或极小项目。但它和 HTML 耦合太紧，改个颜色要翻 HTML 文件，团队协作时容易覆盖彼此的修改。
- 只在原型、邮件模板或单页静态页里考虑用，别在中大型项目里铺开
-
<style></style>必须放在内，放底部会导致页面先无样式闪一下再重绘 - 如果用了 CSS-in-JS 或构建工具（如 Vite、Webpack），
<style></style>里的内容可能被忽略或不热更新
style 属性写行内样式优先级最高，但基本不该手动写
style 属性能直接控制单个元素，比如 <div style="color: red; margin: 0">。它的 CSS 优先级比 <code>class 和 id 都高，连 !important 都压不住——但这恰恰是问题：它没法用选择器批量控制，也不能继承，更不能用媒体查询响应式。
- 只留给 JS 动态设置样式用（比如
element.style.left = '10px'），别手写在 HTML 里 - 用
style属性设的值，会被 JS 的getComputedStyle()读到，但不会出现在document.styleSheets里 - 如果用框架（React/Vue），直接写
style={...}是 OK 的，但记得用驼峰命名（backgroundColor不是background-color）
@import 在 CSS 里导入其他 CSS，但会阻塞并降低性能
@import 只能在 CSS 文件里用（或 <style></style> 块里），不能直接写在 HTML 的 link 标签里。它会让浏览器串行加载：先下载主 CSS，解析到 @import 才去抓被导入的文件，白屏时间更长。
立即学习“前端免费学习笔记（深入）”；
- 现代项目基本不用，构建工具（PostCSS、Sass）的
@import是编译期处理，和运行时的@import不是一回事 - 如果非要用，确保它写在 CSS 文件最开头，否则前面的规则会等它加载完才生效
- HTTP/2 下多个
link并发加载更快，@import没优势，还难调试
