HTML
標(biāo)簽書寫的規(guī)范：

1.代碼縮進，使用Tab鍵。

2.標(biāo)簽通常是成對出現(xiàn)的，一開一關(guān)。也存在一些單標(biāo)簽，如：<meta />、<br />等。

3.標(biāo)簽與它的屬性都必須小寫。

4.所有的標(biāo)簽必須合理嵌套。

是這樣的，標(biāo)簽存在一定的語義性，需要根據(jù)標(biāo)簽自身的屬性來進行合理嵌套。例如：<p>

標(biāo)簽（paragraph）是用來定義段落的，就不用它來布局；像<div><span><em>一念成mo</span></em></div>是不對稱的，這樣是錯誤的。具體的基本嵌套規(guī)則：

1）body可以直接包含塊狀元素、ins、del、script。不可以直接包含行內(nèi)元素

2）ins和del（行內(nèi)元素）可以包含塊狀元素或者行內(nèi)元素，其他任何行內(nèi)元素都不允許包含塊狀元素

3）p、h1-h6可以直接包含行內(nèi)元素和文本信息，但是不允許包含塊狀元素

4）dl元素只允許包含dt和dd，同時dt不能包含塊狀元素，只允許包含行內(nèi)元素，對于dd可以包含任何元素

5）form元素不能夠直接包含input元素。原因在于input元素屬于行內(nèi)元素，form元素僅僅能夠包含塊狀元素

6）table元素只能夠包含caption、colgroup、col、thead、tbody、tfoot，不能夠直接包含tr或者其他任何元素

CSS書寫規(guī)范
1.位置屬性(position, top, right, z-index, display, float等)
2.大小(width, height, padding, margin)
3.文字系列(font, line-height, letter-spacing, color- text-align等)
4.背景(background, border等)
5.其他(animation, transition等)

• 使用CSS縮寫屬性 CSS有些屬性是可以縮寫的，比如padding,margin,font等等，這樣精簡 代碼同時又能提高用戶的閱讀體驗。
• 去掉小數(shù)點前的”0″
• 簡寫命名 很多用戶都喜歡簡寫類名，但前提是要讓人看懂你的命名才能簡寫
• 16進制顏色代碼縮寫 有些顏色代碼是可以縮寫的，我們就盡量縮寫吧，提高用戶體驗為主。
• 連字符CSS選擇器命名規(guī)范
  1.長名稱或詞組可以使用中橫線來為選擇器命名。
  2.不建議使用”_”下劃線來命名CSS選擇器。 輸入的時候少按一個shift鍵； 瀏覽器兼容問題 （比如使用tips的選擇器命名，在IE6是無效的） 能良好區(qū)分JavaScript變量命名（JS變量命名是用””） 這里有一篇破折號與下劃線的詳細討論，英文：點擊查看 中文篇：點擊查看
• 不要隨意使用id
  id在JS是唯一的，不能多次使用，而使用class類選擇器卻可以重復(fù)使用，另 外id的優(yōu)先級優(yōu)先與class，所以id應(yīng)該按需使用，而不能濫用
• 為選擇器添加狀態(tài)前綴 有時候可以給選擇器添加一個表示狀態(tài)的前綴，讓語義更明了，比如下 圖是添加了”.is-”前綴。
• CSS命名規(guī)范（規(guī)則） 常用的CSS命名規(guī)則
  頭：header 內(nèi)容：content/container 尾：footer 導(dǎo)航：nav 側(cè)欄：sidebar 欄目：column 頁面外圍控制整體佈局寬度：wrapper 左右中：left right center 登錄條：loginbar 標(biāo)志：logo 廣告：banner 頁面主體：main 熱點：hot 新聞：news 下載：download 子導(dǎo)航：subnav 菜單：menu 子菜單：submenu
  搜索：search 友情鏈接：friendlink 頁腳：footer 版權(quán)：copyright 滾動：scroll 內(nèi)容：content 標(biāo)簽：tags 文章列表：list 提示信息：msg 小技巧：tips 欄目標(biāo)題：title 加入：joinus 指南：guide 服務(wù)：service 注冊：regsiter 狀態(tài)：status 投票：vote 合作伙伴：partner
• id的命名
  (1)頁面結(jié)構(gòu) 容器: container 頁頭：header 內(nèi)容：content/container 頁面主體：main 頁尾：footer 導(dǎo)航：nav 側(cè)欄：sidebar 欄目：column 頁面外圍控制整體佈局寬度：wrapper 左右中：left right center
  (2)導(dǎo)航 導(dǎo)航：nav 主導(dǎo)航：mainnav 子導(dǎo)航：subnav 頂導(dǎo)航：topnav 邊導(dǎo)航：sidebar 左導(dǎo)航：leftsidebar 右導(dǎo)航：rightsidebar 菜單：menu 子菜單：submenu 標(biāo)題: title 摘要: summary
  (3)功能 標(biāo)志：logo 廣告：banner 登陸：login 登錄條：loginbar 注冊：register 搜索：search 功能區(qū)：shop
  標(biāo)題：title 加入：joinus 狀態(tài)：status 按鈕：btn 滾動：scroll 標(biāo)籤頁：tab 文章列表：list 提示信息：msg 當(dāng)前的: current 小技巧：tips 圖標(biāo): icon 注釋：note 指南：guild 服務(wù)：service 熱點：hot 新聞：news 下載：download 投票：vote 合作伙伴：partner 友情鏈接：link 版權(quán)：copyright
• 注意事項::
  1.一律小寫; 2.盡量用英文; 3.不加中槓和下劃線; 4.盡量不縮寫，除非一看就明白的單詞。
• CSS樣式表文件命名
  主要的 master.css 模塊 module.css 基本共用 base.css 布局、版面 layout.css 主題 themes.css 專欄 columns.css 文字 font.css 表單 forms.css 補丁 mend.css 打印 print.css