<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>CSS格式化 css代码在线压缩-CSS代码格式化，css在线压缩工具可减少CSS文件体积，让CSS文件更规范</title>

<style>

body,textarea,input{font:11pt "微软雅黑",Tahoma;}

</style>

<meta http-equiv="x-ua-compatible" content="ie=7" />

 <script language=JavaScript>

<!--

function $() {

  var elements = new Array();

  for (var i = 0; i < arguments.length; i++) {

  var element = arguments[i];

  if (typeof element == 'string')

    element = document.getElementById(element);

  if (arguments.length == 1)

    return element;

  elements.push(element);

  }

  return elements;

}

function CSSencode(code)

{

 code = code.replace(/\n/ig,'');

 code = code.replace(/(\s){2,}/ig,'$1');

 code = code.replace(/\t/ig,'');

 code = code.replace(/\n\}/ig,'\}');

 code = code.replace(/\n\{\s*/ig,'\{');

 code = code.replace(/(\S)\s*\}/ig,'$1\}');

 code = code.replace(/(\S)\s*\{/ig,'$1\{');

 code = code.replace(/\{\s*(\S)/ig,'\{$1');

 return code;

}

function CSSdecode(code)

{

 code = code.replace(/(\s){2,}/ig,'$1');

 code = code.replace(/(\S)\s*\{/ig,'$1 {');

 code = code.replace(/\*\/(.[^\}\{]*)}/ig,'\*\/\n$1}');

 code = code.replace(/\/\*/ig,'\n\/\*');

 code = code.replace(/;\s*(\S)/ig,';\n\t$1');

 code = code.replace(/\}\s*(\S)/ig,'\}\n$1');

 code = code.replace(/\n\s*\}/ig,'\n\}');

 code = code.replace(/\{\s*(\S)/ig,'\{\n\t$1');

 code = code.replace(/(\S)\s*\*\//ig,'$1\*\/');

 code = code.replace(/\*\/\s*([^\}\{]\S)/ig,'\*\/\n\t$1');

 code = code.replace(/(\S)\}/ig,'$1\n\}');

 code = code.replace(/(\n){2,}/ig,'\n');

 code = code.replace(/:/ig,': ');

 code = code.replace(/  /ig,' ');

 return code;

}

//-->

</script>

</head>

<body>

<table width="80%" border="0" cellspacing="3" cellpadding="0" align="center">

    <tr>

      <td>CSS代码在线压缩工具，CSS格式化，让CSS代码更规范，体积更小，有利于阅读代码和网页加载速度。而且本页提供的CSS代码格式化功能不需要使用YUI Compressor 或者 CSSTidy等离线工具，直接在线操作。</td>

    </tr>

    <tr>

      <td><textarea id=code title="请把CSS代码粘贴在这里" style="WIDTH: 100%; HEIGHT: 300px"></textarea></td>

    </tr>

    <tr>

      <td><input onClick="$('code').value = CSSdecode($('code').value);" type=button value=格式化>  <input onClick="$('code').value = CSSencode($('code').value);" type=button value=压缩化>  <input onClick="window.clipboardData.setData('Text',$('code').value);" type=button value=复制>  <input onClick="$('code').value = window.clipboardData.getData('Text');" type=button value=粘贴>  <input onClick="$('code').value = ''" type=button value=清空> </td>

    </tr>

  </table>

</body>

</html>

CSS格式化 CSS代码压缩工具的更多相关文章

  1. sublime格式化css代码插件：css format

    有时会从网上下载一些css压缩文件,打开后所有代码都在一行,不利于阅读,通过css format插件,能快速展开代码,方便阅读. 参考:Sublime Text 上最好用的 CSS 格式化插件 —— ...

  2. Bootstrap CSS 栅格、代码和表格

    一.bootstrap栅格 Bootstrap 提供了一套响应式.移动设备优先的流式网格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. Bootstrap 网格系统(G ...

  3. css初始化样式代码

    为什么要初始化CSS? CSS初始化是指重设浏览器的样式.不同的浏览器默认的样式可能不尽相同,所以开发时的第一件事可能就是如何把它们统一.如果没对CSS初始化往往会出现浏览器之间的页面差异.每次新开发 ...

  4. jdk、apache-ant结合yuicompressor配置的CSS与JS合并压缩工具

    前序:网上很多css与js合并打包工具,其中最流行的就是ant结合yui-compressor,鉴于学习与工作需要今天就学习了一下这种方式,供大家学习交流. 步骤:1.安装jdk,并配置其变量环境:有 ...

  5. 一些实用的CSS Media Query代码片段，个人采集

    CSS3的出现让响应式Web设计变得简单,CSS3提供了强大的media queries,允许你针对不同的条件设置不同的样式,可以在不修改页面内容的情况下,为不同设备提供不同的样式效果. 以下是一些C ...

  6. JavaScript动态加载资源【js|css】示例代码

    在开发过程中会用到各种第三方的插件,或者自己写在单独文件中的js方法库或者css样式,在html头部总是需要写一大堆的script和link标签,如果想要自己实现动态的引入资源文件,可以使用开源的re ...

  7. CSS初始化示例代码

    CSS初始化示例代码 /* css reset www.admin10000.com */ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code, ...

  8. 前端html、CSS快速编写代码插件-Emmet使用方法技巧详解

    前端html.CSS快速编写代码插件-Emmet使用方法技巧详解   Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语法来 ...

  9. js css样式操作代码（批量操作）

    js css样式操作代码(批量操作) 作者: 字体:[增加 减小] 类型:转载 时间:2009-10-09   用js控制css样式,能让网页达到良好的的用户体验甚至是动画的效果.并且考虑到效率.   ...

随机推荐

  1. 三十道linux内核面试题

      1. Linux中主要有哪几种内核锁? Linux的同步机制从2.0到2.6以来不断发展完善.从最初的原子操作,到后来的信号量,从大内核锁到今天的自旋锁.这些同步机制的发展伴随Linux从单处理器 ...

  2. shell 提取mysql指定数据库下表创建语句为单文件

    dbcn="mysql -h172.16.1.194 -uroot -p123456"; db=dsp_ad_center; ii=0; ct=`$dbcn -N -e " ...

  3. Spring注解运行时抛出null

    关于Spring的注解其实不难,大致需要以下几个流程: 一.配置Spring的注解支持 <?xml version="1.0" encoding="UTF-8&qu ...

  4. MongoDB索引原理

    转自:http://www.mongoing.com/archives/2797 为什么需要索引? 当你抱怨MongoDB集合查询效率低的时候,可能你就需要考虑使用索引了,为了方便后续介绍,先科普下M ...

  5. SGMII 和 Serdes 的详细说明

    Serdes  : SERDES是英文SERializer(串行器)/DESerializer(解串器)的简称.它是一种时分多路复用(TDM).点对点的通信技术,即在发送端多路低速并行信号被转换成高速 ...

  6. MSSQLid清零

    truncate table [cellphone2016].[dbo].[tp_phone_9]

  7. linux 调试利器gdb, strace, pstack, pstree, lsof

    1) 如何使用strace+pstack利器分析程序性能? http://www.cnblogs.com/bangerlee/archive/2012/04/30/2476190.html 此文有详细 ...

  8. CCNotificationCenter(一)

    const std::string testsName[MAX_COUNT] = { "Bug-350", "Bug-422", "Bug-458&q ...

  9. angular学习笔记(二十六)-$http(4)-设置请求超时

    本篇主要讲解$http(config)的config中的timeout项: $http({ timeout: number }) 数值,从发出请求开始计算,等待的毫秒数,超过这个数还没有响应,则返回错 ...

  10. posix多线程--线程私有数据

    1.当多个线程共享一个变量时,将该变量定义为静态或外部变量,使用互斥量确保共享变量的安全访问.如果每个线程都需要一个私有变量值,则该值成为线程的私有数据.程序创建一个键,每个线程独立地设定或得到自己的 ...