link是HTML标签，@import是CSS规则；link并行加载，@import阻塞解析且串行请求；内联style权重最高但无作用域；无位置限制，作用域由选择器决定。
link 和 @import 语法层面就不是一回事
link 是 HTML 标签，写在 里；@import 是 CSS 规则，只能写在 CSS 文件顶部或 块内。浏览器解析时，link 加载的 CSS 会并行发起请求，而 @import 会阻塞后续样式的解析和渲染——哪怕它写在 里，也会让浏览器等它加载完才继续处理后面的规则。
常见错误现象：@import url("base.css"); 放在 中间，导致后面所有样式延迟生效，甚至触发 FOUC（Flash of Unstyled Content）。
-
@import在 CSS 文件中必须出现在所有非@charset规则之前，否则整个规则会被忽略 - IE6–8 不支持
@import的媒体查询语法（如@import url(x.css) screen and (min-width:768px)） - 用
@import加载多个文件时，实际是串行请求，性能明显差于多个link
内联 style 属性只作用于单个元素，且优先级最高
style 属性写在 HTML 标签上，比如
，它的样式只会应用到当前元素，不会影响子元素（除非属性可继承，如 嵌入式 标签的作用范围由所在位置决定
color、font-family）。它的层叠权重是 1000，高于任何选择器（包括 !important 的声明，除非后者也在内联中）。
使用场景有限：适合动态 JS 注入的临时样式、服务端渲染时的首屏关键样式（如 SSR 中的 critical CSS），但绝不该用于维护长期样式逻辑。
立即学习“前端免费学习笔记（深入）”；
- 无法用伪类（
:hover）、伪元素（::before）或媒体查询 - 修改时必须操作 DOM 属性，不能用 CSSOM 的
getComputedStyle()直接覆盖整块声明 - 服务端拼接时容易 XSS，需严格转义
style值中的引号和分号
嵌入式 标签的作用范围由所在位置决定
写在 中，样式作用于整个文档；但如果把它写在 某个元素内部（虽然合法但非常规），浏览器仍会将其提升到 后解析，**并不会**限制作用域到父容器。
