为你的CSS文件减减肥!

分享到:

可能部份程序员在编辑CSS文件的时候, 并不在意使用换行或空格. 但随着代码越来越多, CSS会慢慢变得越来越大. 这个时候, 你可以删除这些换行符和空格符, 对文件进行减减肥.

使用以下代码可以删除你的当前文件夹的所有CSS文件中多余的空格和换行符.

$fileDir = scandir(dirname(__FILE__));
foreach($fileDir as $file) {
    if(pathinfo($file, PATHINFO_EXTENSION) != 'css')continue;
    if($file != '.' && $file != '..' && !is_dir(dirname(__FILE__).'/'.$file)) {
        $fn = dirname(__FILE__).'/'.$file;
        $con = file_get_contents($fn);
        $con = eregi_replace("[\t]+", "    ", $con);
        $con = eregi_replace("[ ]+", " ", $con);
        $con = eregi_replace("[\r]*\n", "", $con);
        //$con = eregi_replace('}', "}\n", $con);
        file_put_contents($fn, $con);
        echo $con;
    }
}

当然, 这只是一个简单的方法, 而要让CSS真正减肥. 还要你合理设计与编写, 当你实现CSS效果不重复叠加的时候. 你的CSS文件就是最精简的了. 编写思路可以为先全局, 再局部.

以下为JS版的CSS代码压缩&格式化工具

CSS压缩&格式化代码工具

请粘贴要格式化或者压缩的Css代码:

  

转换后的Css代码

以下附上该工具的代码

var lCSSCoder = {
    format: function (s) {//格式化代码
        s = s.replace(/\s*([\{\}\:\;\,])\s*/g, "$1");
        s = s.replace(/;\s*;/g, ";"); //清除连续分号
        s = s.replace(/\,[\s\.\#\d]*{/g, "{");
        s = s.replace(/([^\s])\{([^\s])/g, "$1 {\n\t$2");
        s = s.replace(/([^\s])\}([^\n]*)/g, "$1\n}\n$2");
        s = s.replace(/([^\s]);([^\s\}])/g, "$1;\n\t$2");
        return s;
    },
    pack: function (s) {//压缩代码
        s = s.replace(/\/\*(.|\n)*?\*\//g, ""); //删除注释
        s = s.replace(/\s*([\{\}\:\;\,])\s*/g, "$1");
        s = s.replace(/\,[\s\.\#\d]*\{/g, "{"); //容错处理
        s = s.replace(/;\s*;/g, ";"); //清除连续分号
        s = s.match(/^\s*(\S+(\s+\S+)*)\s*$/); //去掉首尾空白
        return (s == null) ? "" : s[1];
    }
};
function CSS(s) {
    $("#code_2").val(lCSSCoder[s](jQuery("#code_1").val()) );
}

除非注明,干草博客文章均为原创,转载请以链接形式标明本文地址

本文地址:http://www.tmper.com/blog/lose-weight-for-css-file/