2012-01-09 25 views
1

有些开发人员特别关注如何格式化他们的代码,原因很多。 CSS是其格式之一没有真正遵循的强烈约定(最可能是因为它的声明性质)。CSS格式约定

我们集团通常遵循这个“惯例”。更长和更详细的文档可以找到here

/* Separate each selector to its own line. */ 
selector-1, 
selector-2<1-space>{ 
    <indent>property:<1-space>value; 
} 

selector { 
    /* Float. */ 
    /* Positioning related declarations. */ 
    /* Visibility. */ 
    /* Box related declarations. */ 
    /* Font related declarations. */ 
} 

有没有一种工具,我可以很容易地定制,以便产生这种格式?其实,我真的很想收集其他有经验的CSS程序员关于例如无论是将多个选择器合并为一行还是将它们分隔成多行都更好,我是否还需要手动进行美化和维护我的代码的逻辑顺序。

注意:这可能不完全适合成为一个SO问题。但是,我非常肯定,一些SO-ers在任职期间积累的经验和维护CSS代码的经验肯定会对这个问题有所了解。

一些CSS自动格式工具exist但没有很好的扩展性。

+1

研究记事本++编写css是一个好的文本编辑器与代码高亮。至于CSS标准,你不会找到具体的东西。只要编写代码,你作为一个开发人员不会介意继承,你应该很好。 – evasilchenko 2012-01-09 02:16:12

+0

一直在读这个问题我自己,你可能会发现在这[文章]一些insite(http://css-tricks.com/different-ways-to-format-css/) – danferth 2012-01-09 02:57:22

+1

哎呀......关闭!我应该在哪里发布这类问题? – moey 2012-01-10 03:19:34

回答

0

我通常遵循这个约定。也只使用一个缩进。这可以让我们的团队获得最大的可读性。

.selector { 
    Style Defs: 
     * dimensions (width, height) styles 
     * positioning (with coordinates) styles 
     * float/clearstyles 
     * spacing (margin, padding, border) styles 
     * display/visibility styles 
     * typography-related (line-height, color, etc.) styles 
     * miscellaneous (list-style, cursors, etc.) styles 
} 
+0

我实际上在寻找比这更彻底的东西。接受,因为这个问题已经结束。 – moey 2012-01-13 06:35:49

-1

我通常分割布局的样式定义,彩色/图像样式定义和@media打印成三个完全独立的样式表,然后将它们合并,精缩并通过定制的处理程序在观看时间缓存。