有没有一个工具可以将css中的属性按顺序排列

Joe_Yun
  • 88

编写css时有时没有逻辑,有没有一个一健化的工具,能把css文件中,每个class或id中的各个属性按照一个固定的顺序排列,比如1、width;2、height;3、float;等等,我想我应该描述清楚了。

回复
阅读 5.2k
2 个回答
ShingChi
  • 810
✓ 已被采纳

好像没有规定的顺序,不过网上有很多版本流传,这是我自己经常用的顺序。

下表顺序为从上到下,从左到右:
========================
display || visibility
list-style : list-style-type || list-style-position || list-style-image
position
top || right || bottom || left
z-index
clear
float

width
max-width || min-width
height
max-height || min-height
overflow || clip
margin : margin-top || margin-right || margin-bottom || margin-left
padding : padding-top || padding-right || padding-bottom || padding-left
outline : outline-color || outline-style || outline-width
border
background : background-color || background-image || background-repeat || background-attachment || background-position

color
font : font-style || font-variant || font-weight || font-size || line-height || font-family
font : caption | icon | menu | message-box | small-caption | status-bar
text-overflow
text-align
text-indent
line-height
white-space
vertical-align
cursor
========================
以上是腾讯 ghost 总结的,具体可看 http://www.cssforest.org/blog/index.p...
以下 mergeCSS 工具就是 ghost 的出品

相关工具有 CSSTidy、CSS Compressor、minify、mergeCSS、YUI Compressor 与 TB Compressor 等等。
http://csstidy.sourceforge.net/
http://www.csscompressor.com/
http://www.cssforest.org/blog/index.p...
http://www.cssoptimiser.com/
http://www.cssdrive.com/index.php/mai...

csstidy 或者 cleancss 都提供属性排序功能的
不过暂时还没看到有自定义顺序的……

宣传栏