CSS:@import vs.<；链接href="&引用&燃气轮机；

好吧，我听说过无数种优化网站加载速度的方法：HTTP请求越少越好（这就是图像精灵诞生的原因）；只注入一个页面所需的JavaScript文件。尽可能使用CSS进行视觉增强，然后考虑SVG图形（尽管这一点仍然值得商榷）；压缩CSS和JavaScript文件以及HTML标记；将脚本合并到一个文件中（再次返回的HTTP请求更少）；gzip你的资产；等等等等

但今天我在一个网站上发现了这样的评论：

“由于我们关心web开发最佳实践，我们不再在项目中使用@import规则。”

澄清一下，我的问题不是关于以下两者之间的区别：

与导入url（“style.css”）

是关于将此添加到HTML文档中的区别：

与将此

@import url（“styles.css”）

添加到主css文件中的区别

那么，从HTML加载CSS文件与从另一个CSS文件加载文件有什么区别呢

我的意思是，HTTP请求仍然存在，它们只是从不同的位置发出的

我读了Steve Souders的文章和About.com的文章，但是他们比较了我上面提到的方法，我没有提到，所以我不清楚为什么不使用

@import

顺便说一句，我不在乎网景4或IE6（感谢上帝，我现在可以这么说）或IE7和FOUC

---

提前感谢。

区别在于并行下载

@import

阻止并行下载。这意味着浏览器将在下载下一个文件之前等待导入导入的文件。

您引用的第一篇文章（Steve Souders的“请勿使用@import”）具体解决了通过

导入的样式表中的

@import

的情况-这与将

@import

放在

标记中一样对性能有害。事实上，更糟糕的是：浏览器首先必须获取链接的样式表，然后解析该样式表，然后发现

@import

规则，然后获取导入的样式表。

最近有人反对@import：当然有人反对它……谷歌构建了一些他们希望我们使用的东西。mod_XX=Apache完成工作，而不是CSS到浏览器的串行往返。节省了0.4秒，这可能是Apache读取所有CSS文件并将它们作为一个.Jrod提供所需的时间，因此，如果在我的主CSS文件中，我只有一个

@import

到重置文件，其中任何重置都没有那么重要，那么我认为它不会那么糟糕，或者根本就不好。当几个CSS文件被“导入”时，性能问题开始变得严重。你认为/推荐什么？最好使用两个链接标签。一个用于重置，另一个用于主，因为它们将并行下载，而不是逐个下载。如果您想进行额外的步骤，可以使用诸如minify之类的库将所有样式表合并为一个样式表。缩小不仅可以最小化请求量，还可以通过剥离注释和空白来减少css总量。我明白了。我们的服务器是Windows服务器，我认为minify不起作用，对吗？（我不是网络/服务器专家）。值得注意的是，CSS预处理器（Sass、LESS、Stylus等）还允许您将样式模块化为单独的文件，但在使用导入时将其编译为单个文件。@Ricardo我链接的是php，但我确信Windows服务器也有类似的脚本。