从某种角度讲，我们自从被压缩输出洗脑后，【原创不易，请尊重版权】【作者：唐霜】都在不断追求把css和js合并压缩后输出【原创内容，转载请注明出处】【版权所有，侵权必究】，以减少http请求数，达到加速网页的目本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】的。但是昨天看到雅虎的做法是，直接将cs本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。s写在网页中，使http请求数减少至0，【未经授权禁止转载】转载请注明出处：www.tangshuang.net或许大道至简。而今天，我们则利用php，【本文受版权保护】【版权所有，侵权必究】将css压缩为一个请求，实现我们目前认为【本文受版权保护】原创内容，盗版必究。最简洁的输出方式。

我已经将该项目托管在GitHub，你可以本文作者：唐霜，转载请注明出处。【作者：唐霜】通过这里【未经授权禁止转载】fork它。完整的代码已经有了，这里就不【版权所有】唐霜 www.tangshuang.net【转载请注明来源】列出来，只做剖析和使用方法介绍。

ob_输出【版权所有，侵权必究】

源代码中使用了ob_start和ob_e原创内容，盗版必究。【本文受版权保护】nd_flush两个函数，实现输出，而在【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。ob_start的参数中传入了一个函数c转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。ompress_css。

ob_start表示开始内容缓存，通过i【转载请注明来源】【访问 www.tangshuang.net 获取更多精彩内容】nclude将多个css包含进来，如果没【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。有ob_start，按理应该是直接显示i本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.netnlcude的css文件的内容。但是加入【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】ob_start后，并不是直接显示出来，原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。而是在执行ob_end_flush的时候【转载请注明来源】本文作者：唐霜，转载请注明出处。才将内容显示出来，在这之前，所有的内容被著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】存放在缓存（内存）中。

而给著作权归作者所有，禁止商业用途转载。ob_start传入原创内容，盗版必究。compress_css作为参数，则是在执行著作权归作者所有，禁止商业用途转载。ob_end_flush之前，对内存的内容进行compress_本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。css操作，因此，在输出内容的时候，cs【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.nets被压缩清理过了。

compress css【版权所有】唐霜 www.tangshuang.net

接下来我们简单讲解一下css的压缩清理。

function compress_css($css) {
  $css = preg_replace('#\/\*[^*]*\*+([^/][^*]*\*+)*\/#isU','',$css); // 清除块级注释
  $css = str_replace(array('<!--','-->'),'',$css);
  $css = str_replace(array("\r","\r","","\t"),'',$css); // 清除换行、缩进
  $css = preg_replace("/\s(?=\s)/",'',$css); // 连续的空格替换为一个空格
  $css = preg_replace("#\s*(:|;|\{|\})\s*#","$1",$css); // 清除一些特定字符前后的空格，这里是可以扩展的，可以根据你的实际情况，添加或删除某些字符
  return $css;
}

代码很简单，虽然可能会有一些遗漏，但是基【原创不易，请尊重版权】原创内容，盗版必究。本上可以将原有的代码压缩到比较小的容量。

浏览器缓存著作权归作者所有，禁止商业用途转载。

浏览器缓存基于URL，因此，访客第一次访【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】问你的网站的时候，请求1次该css即可，未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】第二次访问的时候，会直接从浏览器缓存中读未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net取css。

但是有一个小点需要注意，由于本文希望通过未经授权，禁止复制转载。原创内容，盗版必究。模块化的方式载入css，所以，如果你不同未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net的页面载入不同的css，就会发现，请求不【本文受版权保护】未经授权，禁止复制转载。同的css的时候，会发出新的http请求【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。。所以这里有一个取舍，你是愿意一次性加载原创内容，盗版必究。【原创不易，请尊重版权】所有的css，然后让用户在以后的访问中直【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net接读取浏览器缓存中的css呢，还是愿意在未经授权，禁止复制转载。【转载请注明来源】不同的页面加载不同的css，以让css的【作者：唐霜】转载请注明出处：www.tangshuang.net容量达到最小而加快网页速度？

模块化载入【转载请注明来源】

我们以往的习惯是，将所有的css写在一个【转载请注明来源】【原创内容，转载请注明出处】css文件里面，然后通过压缩，创建一个m本文作者：唐霜，转载请注明出处。【本文受版权保护】in.css文件，但是仍然是所有的css本文作者：唐霜，转载请注明出处。原创内容，盗版必究。。这会使很多没有起到实际作用的css被载本文作者：唐霜，转载请注明出处。原创内容，盗版必究。入，从而影响网页的加载速度。同时，如果你著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。修改了某个样式，需要再次去压缩一遍所有的本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。css，不利于开发调试。

而使用minify-css.php的时候【作者：唐霜】【关注微信公众号：wwwtangshuangnet】，你可以写很多个css文件，每个css文【本文受版权保护】原创内容，盗版必究。件功能用途不同，也可以放心的把插件的cs转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。s和页面的css分开来。你甚至可以为你的【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。网站每个页面撰写特殊的css。总之，cs本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。s文件的个数并不影响最终的结果。

在url中使用一个f=参数，把想要保护的【未经授权禁止转载】本文作者：唐霜，转载请注明出处。文件全部列出来，用一个英文逗号分开。比如【本文受版权保护】【本文首发于唐霜的博客】：base.css,../plugins/a/css/a.css,index.css。【版权所有】唐霜 www.tangshuang.net

在列出这些文件的时候，必须要注意他们的载转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】入顺序，css的优先级是从文件的末尾开始原创内容，盗版必究。【转载请注明来源】的，后面的样式会覆盖前面的样式，因此文件【原创不易，请尊重版权】【版权所有，侵权必究】的载入顺序也很关键。

而通过这种方式，不仅能让你的网页css载本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。入缩小，而且对于撰写开发来说，也更加灵活转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。。

2016-01-17 5989