HTML 編碼習慣
<!DOCTYPE html>
- 爲 html 根元素指定 lang 屬性，從而爲文檔設置正確的語言
<html lang="zh">
<meta charset="UTF-8">
- 引入 CSS 和 JavaScript 文件時不需要指定 type 屬性
<link rel="stylesheet" href="XXXX.css">
<script src="XXXX.js"></script>
- 自閉合標籤尾部不要添加斜線
- 對於屬性的定義統一用雙引號，且 class 屬性放在第一個
CSS 編碼習慣
- CSS 文件命名習慣
- CSS 文件使用無 BOM 的 UTF-8 編碼 ;
- 引入 Normalize.css 初始化樣式作爲每個頁面的基礎樣式，且最好不要做任何修改；
- 採用 style.css 作爲頁面公共樣式，比如 body 等元素，或 .hidden、.unselect；
- 採用 themes.css 文件名實現項目換膚功能；
- 採用 模塊名.css 作爲各模塊私有樣式，如 print.css；
- CSS 樣式命名習慣
- 儘量採用 class 作爲選擇器，避免用 id 選擇器；
- 避免 class 和 id 命名重複；
- 樣式與結構分離，避免行內樣式；
- 代碼命名中，一律採用小寫加連接符，如：header-container；
- 屬性值儘量採用縮寫，如：padding、margin；
- 十六進制顏色儘量採用縮寫，如：#fff；
- CSS書寫順序習慣
- 位置屬性(position, top, right, z-index, display, float等)；
- 大小(width, height, padding, margin)；
- 文字系列(font, line-height, letter-spacing, color- text-align等)；
- 背景(background, border等)；
- 其他(animation, transition等)；
- CSS 常見命名習慣
- 容器：container
- 頁眉：header
- 導航：nav
- 標誌：logo
- 標題：title
- 菜單：menu
- 子菜單：submenu
- 橫幅：banner
- 輪播圖：swipe
- 主體：main
- 頁尾：footer
- 版權：copyright
- 友情鏈接：link
- 按鈕：btn
- 圖標：icon
