Copy Code code as follows:
var lcsscoder={
Format:function (s) {//Format code
S=s.replace (/\s* ([\{\}\:\;\,]) \s*/g, "$");
S=s.replace (/\,[\s\.\#\d]*{/g, "{");
S=s.replace ([^\s]) \{([^\s])/g, "$ {\n\t$2");
S=s.replace (/([^\s]) \} ([^\n]*)/g, "$1\n}\n$2");
S=s.replace (/([^\s]);([^\s\}])/g, "$1;\n\t$2");
S=s.replace (/;\s*;/g, ";"); /Clear Consecutive semicolon
return s;
},
Pack:function (s) {//ZIP code
S=s.replace (/\/\*) (. | \ n) *?\*\//g, "");//Delete Comment
S=s.replace (/\s* ([\{\}\:\;\,]) \s*/g, "$");
S=s.replace (/\,[\s\.\#\d]*\{/g, "{");/fault-tolerant processing
S=s.replace (/;\s*;/g, ";"); /Clear Consecutive semicolon
return s;
}
};
Demo Code:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "lang=" ZH-CN "> <pead> <title> lcsscoder: CSS code compression and formatting </title> <meta http-equiv= "Content-type" content= "text/html"; charset=gb2312 "/> <meta name=" author "content=" Maple rock cnlei "/> <meta name=" copyright "content=" cnlei.y.l@ gmail.com "/> <meta name=" keywords "content=" "/> <meta name=" description "content=" "/> <style type= "Text/css" > Body {text-align:center;} TEXTAREA {border-width:1px;margin:0 5px;} </style> <script type= "Text/javascript" > var lcsscoder={format:function (s) {//Format code S=S.R Eplace (/\s* ([\{\}\:\;\,]) \s*/g, "$"); S=s.replace (/;\s*;/g, ";"); /clear Consecutive semicolon s=s.replace (/\,[\s\.\#\d]*{/g, "{"); S=s.replace ([^\s]) \{([^\s])/g, "$ {\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) {//Zip code s=s.replace (/\/\*. | \ n) *?\*\//g, "")//Delete Comment S=s.replace (/\s* ([\{\}\:\;\,]) \s*/g, "$"); S=s.replace (/\,[\s\.\#\d]*\{/g, "{");//Fault Tolerant processing s=s.replace (/;\s*;/g, ";"); /clear Serial semicolon s = S.match (/^\s* (\s+ (\s+\s+) *) \s*$/);//Remove the trailing blank return (s = = null)? "": s[1]; } }; </script> </pead> <body> <table align= "center" cellspacing= "0" cellpadding= "0" > <tr> &l T;td> Original code: <textarea id= "code_1" rows= "" cols= "" >/*pagehead*/#PageHead {float:left;padding:3px 0; border-bottom:1px solid #b0bec7; margin-bottom:6px;} #hCity Li {float:left;padding:0 10px 0 0;} #hCity li.fst {padding:0} #hRight {float:right;padding:0 5px 0 20px; Background:url (img/ico_home.gif) no-repeat 0 50%;} . Subpage #hRight {background-image:url (img/ico_favorite.gif);} /*pagebody*/#PageBody {float:left;padding:4px 0 0 0;} . Scol {float:left;width:174px;} . MCol {Float:right;width:678px;overflow:hidden;} #Logo {height:66px;margin:0;padding:0;} /*maillogin*/#MailLogin {height:32px;} #MailLogin li {float:left;} #MailLogin li.txt {line-height:20px} #MailLogin LI.INP {padding:0 2px;} #MailLogin LI.INP Input {margin:0;padding:0 4px;border:1px solid #7a9dbb; font:bold 12px/18px tahoma,geneva,arial,sans-serif;height:18px; } #MailLogin li.inp input.notclicked {color: #ccc; font-weight:normal;} #MailLogin Li.sel {padding:1px 10px 0 0;} #MailLogin li.btn {padding:1px 12px 0 5px;} </textarea></td> <td> after conversion: <textarea id= "code_2" rows= "cols=" ></textarea></ td> </tr> </table> <p><input type= "button" value= "format Code" onclick= "CSS (' format ');"/>< Input type= "button" value= "Zip Code" onclick= "CSS (' pack ');" /></p> <script type= "Text/javascript" > <!--function CSS (s) {document.getElementById ("code_2"). V alue=lcsscoder[S] (document.getElementById ("Code_1"). Value); }//--> </script> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
The following is the cloud Habitat Community CSS formatting tools, like friends can also look at the code inside
CSS code format CSS Online compression tool
