如何压缩CSS

Question

我看了半打CSS优化器。我想要的是一个能够将以下代码转换为更加高效的代码的优化器：

background-image: url(../images/background.png);
background-repeat: repeat-x;
background-color: #c0c0c0;

将所有的背景属性合并到一个属性中：

background: #c0c0c0 url(../images/background.png) repeat-x;

我该怎么做？我必须手动完成吗？

- Tom Gullen

---

祝你好运 - 这更像是重构而不是缩小。 - Phil C

Answer 1

尝试使用http://www.cssoptimiser.com/

Input:

body {
    background-image: url(../images/background.png);
    background-repeat: repeat-x;
    background-color: #c0c0c0;
}

（我勾选了“不要删除换行符”）

输出：

body {
    background:#c0c0c0 url(../images/background.png) repeat-x
}

请注意，它也优化了空格-您要求background:<space>#... :)。

可能还有其他/更好的工具可以做到这一点，但是该网站确实满足了您的愿望。

- thirtydot

Answer 2

请确保您的服务器启用了gzip（或其他文本文件压缩形式）。

- Saurav

---

一个好的观点。你可能会通过HTTP压缩节省更多的开销，而不是通过CSS优化。如果你使用了HTTP压缩，一个小贴士可以尽可能地减少CSS文件大小——使用小写颜色：不要使用#CFCFCF，而要使用#cfcfcf——这样压缩比率会略微更高，因为文件中更可能包含字符c和f而不是C和F，因为每个人都使用小写声明，比如color: red。 - thirtydot