CSS编码规则

/* 和HTML一样使用两个空格来代替制表符 */div { ?/* 为了代码的易读性，在每个声明块的左花括号前添加一个空格 */‘ ?padding: 15px; ?/* 每个声明语句的:后应该插入一个空格 */} /* 右花括号单独成行 *//* 为了获得更准确的错误报告，每条声明都应该独占一行 */.selector,.selector-secondary,.selector[type="text"] {/* 不要在rgb()、rgba()、hsl()、hsla()或rect()值的内部的逗号后面插入空格 */background-color: rgba(0,0,0,0.5);}/* 声明顺序，相关的属性声明应当归为一组，并按照下面的顺序排列· Positioning（定位）· Box model· Typographic· Visual· Misc */.declaration-order {/* Positioning */position: absolute;top: 0;right: 0;bottom: 0;left: 0;z-index: 100;/* Box-model */display: block;float: right;width: 100px;height: 100px;/* Typographic */font: normal 13px "Helvetica Neue", sans-serif;line-height: 1.5;color: #333;text-align: center;/* Visual */background-color: #f5f5f5;border: 1px solid #e5e5e5;border-radius: 3px;/* Misc */opacity: 1;}/* 将媒体查询Media query的位置放在相关规则的附近 */.element {}.element-avatar {}.element-selected {}@media (min-width: 480px) {.element {}.element-avatar {}.element-selected {}}/*当使用特定厂商的带有前缀的属性时，通过缩进的方式，让每个属性的值在垂直方向对齐，这样便于多行编辑。*/.selector { ?-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.15); ?????????box-shadow: 0 1px 2px rgba(0,0,0,0.15);}/* 对于只包含一条声明的样式，放在一行，多条声明的样式分为多行 */.span1 { width: 60px; }