[TOC] ## 文件命名 ### 項目命名 lower-case 如 yii-review ### 目錄命名 - 盡量只用一個單詞 - 前端資源常用命名：js css images styles scripts ### 靜態資源命名 lower-case 如 site.css error-report.js home-banner.png ## HTML語法 ### 屬性順序 - class - id - name - data-* - src, for, type, href, value - placeholder, title, alt - aria-*, role - required, readonly, disabled ### Boolean屬性 disabled checked selected 無需申明= ## CSS語法 ### 引號 CSS中統一使用單引號''或雙引號"" ### 選擇器命名 - id使用camelCase 如 #myModal - class使用lower-case 如 .text-danger ### 屬性申明順序 按下面的順序做分組處理，組之間有一個空行。 ~~~ .declaration-order { display: block; float: right; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; border: 1px solid #e5e5e5; border-radius: 3px; width: 100px; height: 100px; font: normal 13px "Helvetica Neue", sans-serif; line-height: 1.5; text-align: center; color: #333; background-color: #f5f5f5; opacity: 1; } ~~~ ### 顏色 用小寫字母，盡量簡寫。 ~~~ .element { color: #abcdef; background-color: #012; } ~~~ ### 雜項 - 屬性值'0'后面不要加單位 - 去掉小數點前面的0 - 去掉數字中不必要的小數點和末尾的0 - 發布的代碼中不要有 @import（如何實現？？？） ## JavaScript語法 ### 變量命名 - 標準變量采用camelCase命名 - 構造函數，大寫第一個字母 ### 變量聲明 一個函數作用域中所有的變量聲明盡量提到函數首部，用一個var聲明，不允許出現兩個連續的var聲明。 ~~~ var value = 10, result = value + 10, i, len; ~~~ ### null 適用場景： - 初始化一個將來可能被賦值為對象的變量 - 與已經初始化的變量做比較 - 作為一個參數為對象的函數的調用傳參 - 作為一個返回對象的函數的返回值 不適用場景： - 不要用null來判斷函數調用時有無傳參 - 不要與未初始化的變量做比較 ~~~ var a = null; if (a === null) { ... } ~~~ ### undefined 使用typeof和字符串'undefined'對變量進行判斷。 ~~~ if (typeof person === 'undefined') { ... } ~~~