我如何缩小我的CSS？

Question

可能重复：

Any recommendations for a CSS minifier?

我有一个CSS文件，它相当大。有什么软件我可以用来使文件更小，这样才能更快地加载吗？另外，我还能做些什么来增加我的CSS被浏览器缓存的机会吗？

Answer 1

您可以使用CSS缩小器或压缩器将CSS最小化。这个问题的答案将为你解答：

What are some good css and js minimizers for production code?

至于缓存，当然，文件越小越好。还可以设置服务器发送的过期标头。雅虎在这里有一些信息：

http://developer.yahoo.com/performance/rules.html

Answer 2

是!它被称为css压缩/缩小。在我看来，这是最好的压缩器：https://csscompressor.net/粘贴在你的CSS中，它将被压缩。另外，确保在HTML中使用尽可能少的选择器，并查看是否可以组合它们并删除不需要的特性。使用此代码设置默认值，这样您就不必在主css文件的顶部写入每个选择器。一旦你这样做了，然后缓存和压缩你的CSS，将它添加到站点根目录中的.htaccess文件中。

#GZIP ----------------------------
AddOutputFilterByType DEFLATE text/css

<ifModule mod_gzip.c>
  mod_gzip_on Yes
  mod_gzip_dechunk Yes
  mod_gzip_item_include filee \.(html?|txt|css|js|php)$
  mod_gzip_item_include handler ^cgi-script$
  mod_gzip_item_include mime ^text/.*
  mod_gzip_item_include mime ^application/x-javascript.*
  mod_gzip_item_exclude mime ^image/.*
  mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>

<ifmodule mod_php4.c>
    php_value zlib.output_compression 16386
</ifmodule>

#CACHE ----------------------------

<ifModule mod_headers.c>
  <filesMatch "\\.(css)$">
    Header set Cache-Control "max-age=2592000, public"
  </filesMatch>
</ifModule>
<ifModule mod_expires.c>
  ExpiresActive On
  ExpiresByType text/css "access plus 604800 seconds"
</ifModule>

这应该缓存，并使您的css尽可能小。这是我在我的网站上使用的，缓存后的加载时间在一个良好的连接上还不到1秒！

Answer 3

您可以使用CSS Minifier。

这必须由服务器端完成才能有用。

您还应该使用某种形式的缓存控制；例如，发送遥远的过期标头，并将最后修改的时间作为GET param附加到文件中。这样，当您更新您的文件时，客户端浏览器将下载它。如果您不修改它，您的最终用户将只下载一次(直到到期)。