css - 在页面中加载多个 CSS 的正确方法

Question

根据雅虎的规定，我们必须限制对服务器的请求数量以提高网站的性能。同意这一点，我会合并我的 CSS 文件，但我不确定以下哪一种方法是合适的或正确的。

方法1

文件:css1.css

.
.
.
.
.css1style { }
.
.

文件:css2.css

.
.
.
.
.css2style { }
.
.

然后文件:parent.css

@import "css1.css";
@import "css2.css";

方法2

文件:parent.css

.css1style { }
.css2style { }

当我们有非常大的样式表集合时，方法 2 可能会产生可管理性问题。

• 哪一种是正确的方法？
• 如果我采用方法 1，我是否仍会遵守 yahoo 的规则？
• 有更好的方法来完成我正在尝试的事情吗？

Answer 1

我会将它们压缩到一个文件中以减少 http 请求。看HTML5Boilerplate's Build Script 。它允许您在单独的文件中进行编码并在一个缩小的文件中进行部署。这始终是最佳实践。