1. link

link 是 HTML 文件中的标签，在<head>标签中使用。如果指定了媒体查询类型，则只有在满足条件的情况下才会引入指定的样式文件。

2. @import

@import 是 CSS 中的一个@规则，必须先于所有其他类型的规则（@charset 规则除外），结尾需要加分号。@import 用于从其他样式表导入样式规则。因为必须要用 CSS 引擎来解析，所以只能出现在 CSS 文件中或 HTML文件的 <style> 标签中。

3. 两者异同

1 link 是 HTML 文件中的标签，在<head>标签中引入 CSS 文件。
2 @import 是 CSS 中的一个规则，只能出现在 CSS 文件中或 HTML文件的<style>标签中。
3 @import 和 link 一样，都可以定义媒体查询(media queries)

4. 总结

1 非模块化开发

@import 引入的样式在所在的 CSS 文件加载完成后再加载，不推荐使用。
正常开发时，所有的 CSS 文件都需要引入。如果在某个 CSS 文件中使用了 @import ，浏览器要先下载使用了 @import 的 CSS，解析完后发现有另外的 CSS 文件需要下载，再去下载、解析，增加了用户的等待时间。
如果 CSS 内容不多, 可以合并到一个文件里, 减少请求次数。对于多个独立的 CSS 文件, 最好直接用 link 标签加载。