css - @导入与链接

Question

首先我知道标题说这是一个重复的问题 here , here , 和 here .我读到的关于这个主题的所有内容都已有两年多的历史了。那个时期发生了很多变化，所以同样的想法是否仍然可取？

这是一个示例，我在样式表中使用@import 来引入我的重置 CSS 和其他几个样式。我应该将其从 @import 更改为至 <link> ？根据这个article我应该使用链接。所以我问其他开发人员，什么是真正最好的日期(2011 年 8 月 25 日)

Answer 1

在过去的一两年中，即使有任何变化，也没有太大变化，而且从那时起我们仍在处理许多相同的浏览器，因此您不应该改变您的做法。

<link>在所有情况下都优于 @import ，因为后者会阻止并行下载，这意味着浏览器将等待导入的文件完成下载，然后再开始下载其余内容。

您可以在此处查看详细信息:

http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

所以，虽然 @import可能很方便，仅此而已。如果你真的想利用快速加载时间，使用最少数量的样式表(在大多数情况下可能是一个)，用高效的选择器(通常的东西)编写好的 CSS，缩小它，并使用 <link>标签。

---

这本来是一条评论，但它太长了:

而不是 @import (我知道这 非常方便)，您应该在网站上线时将这些文件合并为一个文件。无论如何你不应该在那个时候进行调整，并且有许多工具可以帮助缩小它。就个人而言，使用 PHP，我有一个配置文件，我在其中定义了所有写入单独 CSS 文件的 CSS 文件(我将在 <link> 标记中引用的文件)，然后如果缓存版本是旧的(手动确定)或自动)，它将它们组合/缩小并将内容写入“缓存”文件，并返回一个时间戳查询字符串以附加到 CSS 文件名以强制重新下载。

如果您也在使用 PHP，我强烈推荐 cssmin , 它可以解析 @import 的样式表并将内容拉入一个文件，并处理缩小的所有方面。