CSS代码书写规范

属性在书写时，应按功能进行分组，以
Formatting Model（布局方式、位置）
Box Model（自身、尺寸）
Typographic（文本）
Visual（视觉效果、其他属性）
顺序书写，以提高代码的可读性。

Formatting Model 属性包括：position / top / right / bottom / left / float / display / overflow
Box Model 属性包括：border / margin / padding / width / height
Typographic 属性包括：font / line-height / text-align / word-wrap / white- space / text-decoration
Visual 属性包括：background:linear-gradient … / color / transition / list-style / cursor / border-radius / box-shadow / text-shadow

.sidebar {
    /* formatting model（布局方式、位置）: position / overflow / z-index / display / ...  */
    position: absolute;
    top: 50px;
    left: 0;
    overflow-x: hidden;

    /* box model（自身、尺寸） : sizes / margin / padding / borders / ...  */
    width: 200px;
    padding: 5px;
    border: 1px solid #ddd;

    /* typographic（文本） : font / aligns / text styles / ... */
    font-size: 14px;
    line-height: 20px;
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;

    /* visual（视觉效果、其他属性） : colors / shadows / gradients / ... */
    color: #333;
    background: #f5f5f5;
    border-radius: 10px;
    -webkit-transition: color 1s;
       -moz-transition: color 1s;
            transition: color 1s;
}