合并导入的css文件

Question

我有一个样式表文件，可以导入其他三个css文件：

<link rel="stylesheet" type="text/css" href="style.css" media="screen" />

style.css包含：

@import url("../ins/style.css");
@import url("commerce/css/style.css");
@import url("../in/custom.css");

我想改善加载时间并减少请求数量，因此我希望将三个css文件合并为一个导入顺序相同的顺序。但问题是所有布局都搞砸了。我真的想知道为什么会发生这种情况，因为导入css文件与包含它们相同。有任何想法吗？感谢您花时间阅读。

Answer 1

如果commerce / css / style.css是保存布局的CSS文件，则可能是该路径对所有页面都不正确。我会确保所有路径都相对于root，以确保它们在整个站点中是正确的。这包括组合css文件的原始href url。

我也不太确定如果将三个导入放在一个css中，加载的时间就会减少，而不是在html中链接它们。如果你想减少加载时间，你需要以某种方式减少负载数量，例如当浏览器是Internet Explorer等时只加载Internet Explorer css。

让我知道任何进展。

Answer 2

您可以尝试SSI includes，H5BP ant build script甚至borschik来合并您的CSS。