📚前端面试题速记
Q36

<link> 和 @import 区别?

速记答案(30 秒)

<link> 是 HTML 标签,可并行加载,优先级高。@import 在 CSS 内再引入 CSS,会串行加载,性能更差,旧浏览器支持也一般。建议:生产环境尽量用 <link>。

📖 详细讲解

标准面试回答(推荐记住)

link 和 @import 都能引入 CSS,但有几个区别。link 是 HTML 标签,可以引入 CSS、icon 等,加载是并行的,优先级更高。@import 是 CSS 语法,只能引入 CSS,而且是串行加载,必须等前一个加载完才能加载下一个,性能更差。另外 link 可以用 JS 动态控制,@import 不行。一些老浏览器对 @import 支持也不好。所以生产环境推荐用 link。

面试要点

  • link 并行加载,@import 串行
  • link 优先级更高
  • 生产环境用 link