好的，我已经听说过如何优化网站加载速度的百万种方式：HTTP请求越少越好（这就是图像精灵诞生的原因）;仅注入一页专门需要的JavaScript文件。尽可能使用CSS进行视觉增强，然后可以考虑使用SVG图形（虽然这个仍然有争议）;压缩您的CSS和JavaScript文件以及HTML标记;将您的脚本整合到一个文件中（再次返回更少的HTTP请求）; gzip你的资产;等等。
但今天我在网站上发现了这条评论：
“由于我们关心Web开发最佳实践，我们不再在项目中使用@import规则。”
为了澄清，我的问题不是关于：
之间的区别 <link rel="stylesheet" href="file.css">与<style type="text/css">@import url("styles.css");</style>
将此添加到您的HTML文档之间的区别是：<link rel="stylesheet" href="file.css">与将@import url("styles.css")添加到您的主CSS文件中。
那么，从HTML加载CSS文件与从另一个CSS文件加载文件有什么区别？
我的意思是，HTTP请求仍然存在，它们只是来自不同的位置。
我阅读了Steve Souders的 don’t use @import 文章和About.com的文章 What's the Difference Between @import and link for CSS? ，但他们比较了我上面提到的方法我不是我指的是为什么不使用@import。
提前致谢。
答案 0 :(得分：6)
差异归结为并行下载。 @import阻止并行下载。这意味着浏览器将在下载下一个文件之前等待导入导入的文件。
答案 1 :(得分：1)
您引用的第一篇文章（Steve Souders的“不使用@import”）专门解决了通过@import导入的样式表中<link>的情况 - 这与性能一样糟糕将@import放在<style>标记内。事实上，它有点糟糕：浏览器首先必须获取链接的样式表，然后解析该样式表，然后发现@import规则，然后获取导入的样式表。