一直想自己写个css格式化工具,因为原先的《CSS代码格式化和压缩化》工具,压缩or格式化的都不是我的编码习惯。我的格式化工具也许代码方面细节方面都没他的好,但是符合自身需要的东西才是好东西

从去年刚学CSS到上个月初,应该正好一年时间。这一年时间,我的CSS编码习惯一直是这样的:

body,div,h1,h2,h3,h4,h5,h6,p,td,tr,form,ul,ol,li,dl,dt,dd,input,button,textarea{
margin:0;
padding:0;
}
table{
border-collapse:collapse;
border-spacing:0;
margin:0;
padding:0;
line-height:17px;
}
h1,h2,h3,h4,h5,h6{
font-size:100%;
font-weight:normal;
}
fieldset,img{
border:none;
}
ul,ol,li{
list-style:none;
vertical-align:bottom;
}
a,a:link,a:visited,a:hover,a:active{
text-decoration:none;
}

直到上月的中旬开始,我才开始转变自己的编码习惯,因为这种编码格式,占的CSS行数太多,不利于查看,尤其是在做大项目的时候。所以我开始采用了下面的CSS编码习惯:

body,div,h1,h2,h3,h4,h5,h6,p,td,tr,form,ul,ol,li,dl,dt,dd,input,button,textarea{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0;margin:0;padding:0;line-height:17px}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
fieldset,img{border:none}
ul,ol,li{list-style:none;vertical-align:bottom}
a,a:link,a:visited,a:hover,a:active{text-decoration:none}
.clear{clear:both}
.clearfix:after{display:block;content:"";clear:both;height:0}
.clearfix{*zoom:1}

这种方式,明显看起来更清爽一些。但是这种又不利于阅读,既然以前收藏的《CSS代码格式化和压缩化》工具满足不了我的需求,那就自己写个好了。于是今天一大早起来看《javascript权威指南》、到公司闲着没事搜索相关文章(《精通 JS正则表达式》),晚上成功写出了半成品。为什么说是半成品呢,因为只限于我自己的编码习惯来操作,别人的CSS未必能很好的格式化出来= =(今天又修改了一下,现在应该是完结版了-2013.07.04)

好吧,晒下地址,欢迎批评指正~

CSS格式化工具:
http://sandbox.runjs.cn/show/gvnlsgu7

CSS格式化工具的更多相关文章

  1. css 10 款非常棒的CSS代码格式化工具推荐

    http://www.iteye.com/news/23692/  10 款非常棒的CSS代码格式化工具推荐 2011-12-14 09:31 by 副主编 wangguo 评论(0) 有9111人浏 ...

  2. 10 款非常棒的CSS代码格式化工具推荐

    如果你刚开始学习CSS,这意味着你的很多代码或结构可能需要优化,比如你可能过多使用了类.添加了多余的间隔或空行等等,这将导致代码臃肿.混乱,可读性和执行效率将大大降低. 本文为你整理了几款CSS工具, ...

  3. 新一代的代码编辑神器Sublime Text 3(使用指南)

    首先附上官网下载链接:http://www.sublimetext.com/3 接下来是安装sublime最强大的插件功能:Package Control 一.简单的安装方法 使用Ctrl+`快捷键或 ...

  4. Sublime Text 2

    常用功能: 安装Package Control:https://sublime.wbond.net/ 多行选择.多行编辑鼠标选中多行,按下 Ctrl+Shift+L (Command+Shift+L) ...

  5. 微信小程序开发-rem转换rpx小工具

    实现原理: 对样式进行格式化,然后根据 “rem” 进行拆分,这样就会拆分成一个数组 [str1,str2,str3...,str6], 除了最后一个元素,前边的元素都会以 “rem” 样式的数值结尾 ...

  6. Matplotlib数据可视化(3):文本与轴

      在一幅图表中,文本.坐标轴和图像的是信息传递的核心,对着三者的设置是作图这最为关心的内容,在上一篇博客中虽然列举了一些设置方法,但没有进行深入介绍,本文以围绕如何对文本和坐标轴进行设置展开(对图像 ...

  7. CSS代码格式化工具

    CSS代码格式化工具 http://tool.lanrentuku.com/cssformat/ 可实现CSS代码格式化和CSS在线压缩 请将CSS代码复制到下面表单中:    

  8. 非常好用的css代码格式化工具

    http://tool.lanrentuku.com/cssformat/ 可以横向排列和竖向排列,感谢互联网,让我找到你了.

  9. Dreamweaver CS5 CS6 代码格式化、美化插件(可同一时候格式化HTML、JavaScript、CSS )眼下最好用的代码格式化扩展

    Dreamweaver CS5 CS6 代码格式化.美化插件(可同一时候格式化HTML.JavaScript.CSS )眼下最好用的代码格式化扩展. 众所周知,Dreamweaver CS5 CS6 ...

随机推荐

  1. 01_MapReduce流程总结

    1. MapReduce整体流程 1. 每个map,reduce都作为1个独立进程process启动(多进程并发方式,spark是多线程并发) 2. 由于进程空间独享,因此方便控制每个map, red ...

  2. HDU 3594 Cactus(仙人掌问题)

    http://acm.hdu.edu.cn/showproblem.php?pid=3594 题意: 一个有向图,判断是否强连通和每条边只在一个环中. 思路: 仙人掌问题. 用Tarjan算法判断强连 ...

  3. HDU4910 Problem about GCD

    本文版权归ljh2000和博客园共有,欢迎转载,但须保留此声明,并给出原文链接,谢谢合作. 本文作者:ljh2000 作者博客:http://www.cnblogs.com/ljh2000-jump/ ...

  4. ajax实现用户注册

    需求分析 页面中给出注册表单: 在username input标签中绑定onblur事件处理函数. 当input标签失去焦点后获取 username表单字段的值,向服务端发送AJAX请求: djang ...

  5. Eclipse中快速定位

    Eclipse中快速定位 选中项目,ctrl+h 一.目标 查找如下的页面属于哪个activity 二.步骤 1.查找关键字 上述页面中“点我”两个字比较显眼,我们可以去android项目中搜索出现“ ...

  6. php5权限控制修饰符,interface和abstract

    1.public:public表明该数据成员.成员函数是对所有用户开放的,所有用户都可以直接进行调用 2.private:private表示私有,私有的意思就是除了class自己之外,任何人都不可以直 ...

  7. poj3348凸包面积

    用叉积求凸包面积 如图所示,每次找p[0]来计算,(叉积是以两个向量构成的平行四边形的面积,所以要/2) #include<map> #include<set> #includ ...

  8. Codeforces Round #349 (Div. 2)

    第一题直接算就行了为了追求手速忘了输出yes导致wa了一发... 第二题技巧题,直接sort,然后把最大的和其他的相减就是构成一条直线,为了满足条件就+1 #include<map> #i ...

  9. 二十三 Python分布式爬虫打造搜索引擎Scrapy精讲—craw母版l创建自动爬虫文件—以及 scrapy item loader机制

    用命令创建自动爬虫文件 创建爬虫文件是根据scrapy的母版来创建爬虫文件的 scrapy genspider -l  查看scrapy创建爬虫文件可用的母版 Available templates: ...

  10. request.getPathInfo() 方法的作用

    request.getPathInfo(); 这个方法返回请求的实际URL相对于请求的serlvet的url的路径.(个人理解.) 比如,有一个Servlet的映射是这样配置的: <servle ...