代碼規(guī)范在合作開發(fā)中極為重要幕侠,一個(gè)合格的程序員呼巷,代碼規(guī)范必須掌握稻扬。
HTML
用兩個(gè)空格來代替一個(gè)tab(因?yàn)樵诓煌木庉嬈髦衪ab等于多少個(gè)空格是不一樣的)
嵌套元素應(yīng)該縮進(jìn)一次(相當(dāng)于兩個(gè)空格)
屬性的定義都用雙引號外傅,而不要單引號
不要在自閉合的元素尾部添加斜線
HTML5 doctype
為這個(gè)HTML頁面添加標(biāo)準(zhǔn)模式
<!DOCTYPE html>
- 引入css、js文件鳄哭,一般不用指定type要糊,因?yàn)閠ext/css和type/javascript分別是它們的默認(rèn)值
CSS
- 在為選擇器分組時(shí)候,應(yīng)該將單獨(dú)的選擇器放在一行
/* 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;
}
- 為了獲得準(zhǔn)確的錯(cuò)誤報(bào)告妆丘,每條聲明都應(yīng)該獨(dú)占一行
- 十六進(jìn)制應(yīng)該小寫锄俄,如#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的命名應(yīng)該只能包括小寫字符和破折號(不是下劃線也不是駝峰)珊膜。應(yīng)該盡可能短,但是含義務(wù)必明確宣脉。