CSS的CSS压缩方法

html-css08

CSS的CSS压缩方法,第1张

理想的情况是只拥有一个CSS文件(如果你使用RWD以支持IE的老版本,那就需要两个CSS文件。)构建并维护几个单独的CSS文件也算合理,但在部署到产品服务器之前,你应该将它们集合在一起,并删掉那些不必要的空白区域。

Saas、LESS和Stylus等预处理器可帮你完成这些痛苦的工作。 Grunt.js、 Gulp等工具可自动化你的工作流。如果你更喜欢GUI,可借助Koala提供的免费跨平台应用。

如果你觉得这些比较麻烦,也可手动通过命令行工具将CSS文件集中在一起,如在Windows中,可使用如下代码:

在Mac/Linux中,可使用如下代码:

最终文件经过在线CSS压缩工具(如 cssminifier.com、 CSS Compressor &Minifieror等)压缩后即可运行。

最后,请记住在头部(Head)加载所有CSS,以便浏览器展示接下来的HTML元素,同时也可避免浏览器下次再重绘页面元素。

由灵活,没有一定的局限。但是常期以来为了阅读和维护等方面的经验,一般都是这样的格式:

标名 {

属性:属性值

属性:属性值;

}

当然这样大家都能理解,你自己也好维护,没有什么特殊的要求的!

为了便于阅读有人建议,CSS分为以下方面的控制:

先写位置等:

如:position:absolute

top,left,width,height等,

空一行,再写布局方面的,如:margin,padding等;

空一行,写字体格式:如line-height等

再空一行,写字体相关!如:font-size,font-color等;

最后是其他的属性!

但一般情况下,我们还是没有必要写那么多的属性值对的!所以就很少有人去空行做这些东西了!

但是一般内容较少时,可以直接写在一行,并不影响阅读的!

纠正一点的是:CSS文件进行调用时并不像一楼所说!不换行可以减少代码的大小!这是毫无根据的臆断!因其会自动解释换行和空白的!代码的大小是因为我们写了一些没有必要的东西所形成的时空代价,比如在body中已经有font-size:9pt而在BODY中的一个DIV中,如果要设置字体为9pt时没有必要再定义font-size:9pt了,如果再定义就是出现代码时的增大。还有一些默认也没有必要写出。

如果真如一楼所说,我想问一下一楼:你知道吗,在CSS中是可以加注释的,请问注释会不会增加代码量?答案是不会!因为其不运行!

sorry,对不起楼上,我说的是运行方面的,没有说下载方面的事。恕我直言,如果有一个人一个不足0。2K的CSS而写了N个GB的注释的话,那他一定有病了!注释不是发文章,一个CSS文件最多能有多少注释?不过我经常遇到写好的CSS进行压缩加密的情况,为了防止别人偷看,至于说能有多少,一个回车只是一个字符,占8bits,一个byte,请问一下,连写与其能有多大分别?再者请问一下为什么还要分开写呢?这是代码的维护时很难读懂的情况下还要讲时间代价吗?

程序的时空代价是指:运行时间与编写时间的相比,存储空间与运行空间的对比。

对于离散型网页来说,下载页面的同时还在下载CSS文件,而且CSS会放在机器的临时文件夹中,这样,整个网站也用不了下载几个CSS,且下次打开网页不须再下CSS。这样你认为呢?

格式化就是以一种可读性较高的方式呈现(排列)CSS中的样式。

普通的压缩就是减去空格和换行,还有些数据量比较大的CSS文件,则还会将每条规则的id或class的名称用简短的字符代替,实现更细致的压缩。