代码规范在合作开发中极为重要,一个合格的程序员,代码规范必须掌握。
HTML
用两个空格来代替一个tab(因为在不同的编辑器中tab等于多少个空格是不一样的)
嵌套元素应该缩进一次(相当于两个空格)
属性的定义都用双引号,而不要单引号
不要在自闭合的元素尾部添加斜线
HTML5 doctype
为这个HTML页面添加标准模式
<!DOCTYPE html>
- 引入css、js文件,一般不用指定type,因为text/css和type/javascript分别是它们的默认值
CSS
- 在为选择器分组时候,应该将单独的选择器放在一行
/* Good CSS */
.selector,
.selector-secondary,
.selector[type="text"] {
padding: 15px;
margin-bottom: 15px;
background-color: rgba(0,0,0,.5);
box-shadow: 0 1px 2px #ccc, inset 0 1px 0 #fff;
}
- 为了获得准确的错误报告,每条声明都应该独占一行
- 十六进制应该小写,如#fff.还有尽量使用小写形式
- 为选择器的属性加上双引号
input[type="text"]
- 避免为0添加单位
margin:0;
- 声明顺序
1.Positioning(位置)
2.Box model(盒子模型)
3.Typographic(排版)
4.Visual(视觉)
.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;
/* Typography */
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;
}
- 不要使用@import
- 注释(自我描述、易于他人理解)
- class的命名。注意class的命名应该只能包括小写字符和破折号(不是下划线也不是驼峰)。应该尽可能短,但是含义务必明确。