页面导入时，使用 link 和 @import 有什么区别

页面导入时，link 和 @import 是两种不同的方法，它们在工作原理和用法上存在一些区别。

link 是 HTML 中用于导入外部资源的标签，它通常用于导入样式表文件。与 @import 不同，link 标签会在页面加载时同时加载外部资源，并且可以定义在 head 标签内或者在 body 标签内的任何位置。

<head>
  <link rel="stylesheet" href="style.css">
</head>

@import 是 CSS 中的一个指令，它用于导入外部样式表文件。与 link 标签不同，@import 指令必须定义在样式表文件的顶部，并且它会在页面加载完成后才会加载外部资源。

@import url("style.css");

总的来说，link 标签更适用于在页面加载时立即加载外部资源，而 @import 指令更适用于在页面加载完成后再加载外部资源。但是，由于 @import 指令会影响页面的加载速度，因此一般不建议在生产环境中使用它。