有时你必须使用@import而不是内联。如果你正在开发一个复杂的应用程序，它有32个或更多的css文件，而且你必须支持IE9，那么你别无选择。IE9忽略前31个之后的任何css文件，这包括内联css。但是，每个表可以导入31个其他表。

出于速度考虑，最好不要使用@import在页面中包含CSS。看看这篇优秀的文章，了解为什么不去:http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

此外，通过@import标记来缩小和合并css文件通常更困难，因为缩小脚本不能从其他css文件中“剥离”@import行。当你将它们包含为<link标签时，你可以使用现有的minify php/dotnet/java模块来进行缩小。

所以:使用<link />代替@import。

在头部添加css样式表与使用导入功能并没有太大区别。使用@import通常用于链接样式表，这样可以轻松地扩展样式表。它可以用来轻松地交换不同的颜色布局，例如结合一些一般的css定义。我认为主要的优势/目的是可扩展性。

我也同意xbonez的评论，因为可移植性和可维护性是额外的好处。

有时你必须使用@import而不是内联。如果你正在开发一个复杂的应用程序，它有32个或更多的css文件，而且你必须支持IE9，那么你别无选择。IE9忽略前31个之后的任何css文件，这包括内联css。但是，每个表可以导入31个其他表。

我使用@import的一个地方是当我处理一个页面的两个版本时，英语和法语。我将使用main.css用英文构建我的页面。在构建法语版本时，我将链接到一个法语样式表(main_fr.css)。在法语样式表的顶部，我将导入main.css，然后为法语版本中需要不同的部分重新定义特定的规则。

现代浏览器可以使用css文件定义全局变量。该文件可以导入到其他可以使用该变量的css文件中。

例如，要在站点中使用一致的颜色:

colors.css :根{ ——bg-dark: # ffffff; ｝ home.css @ import“colors.css”; 身体:var(——bg-dark)