規范
1、對于非通用樣式，在樣式比較簡單的前提下，盡量使用面向屬性的命名方式，如多使用pb20、ml20這種寫法。
2、對于通用樣式，盡量不要使用分離方式。因為不便修改。
3、三無原則：
- 無ID，如#test，ID一般與業務有關
- 無層級，如.test span，這種寫法一是重用性低，二是會影響渲染效率
- 無標簽，ul.test同上。
CSS樣式命名
網頁公共命名
-
wrapper 頁面外圍控制整體布局寬度
-
container或#content 容器,用于最外層
-
layout 布局
-
head, #header 頁頭部分
-
foot, #footer 頁腳部分
-
nav 主導航
-
subnav 二級導航
-
menu 菜單
-
submenu 子菜單
-
sideBar 側欄
-
sidebar_a, #sidebar_b 左邊欄或右邊欄
-
main 頁面主體
-
tag 標簽
-
msg #message 提示信息
-
tips 小技巧
-
vote 投票
-
friendlink 友情連接
-
title 標題
-
summary 摘要
-
loginbar 登錄條
-
searchInput 搜索輸入框
-
hot 熱門熱點
-
search 搜索
-
search_output 搜索輸出和搜索結果相似
-
searchBar 搜索條
-
search_results 搜索結果
-
copyright 版權信息
-
branding 商標
-
logo 網站LOGO標志
-
siteinfo 網站信息
-
siteinfoLegal 法律聲明
-
siteinfoCredits 信譽
-
joinus 加入我們
-
partner 合作伙伴
-
service 服務
-
regsiter 注冊
- arr/arrow 箭頭
-
guild 指南
-
sitemap 網站地圖
-
list 列表
-
homepage 首頁
-
subpage 二級頁面子頁面
-
tool, #toolbar 工具條
-
drop 下拉
-
dorpmenu 下拉菜單
-
status 狀態
-
scroll 滾動
- .tab 標簽頁
- .left .right .center 居左、中、右
- .news 新聞
- .download 下載
- .banner 廣告條(頂部廣告條)
電子貿易相關
- .products 產品
- .products_prices 產品價格
- .products_description 產品描述
- .products_review 產品評論
- .editor_review 編輯評論
- .news_release 最新產品
- .publisher 生產商
- .screenshot 縮略圖
- .faqs 常見問題
- .keyword 關鍵詞
- .blog 博客
- .forum 論壇
CSS文件命名 說明
- master.css,style.css 主要的
- module.css 模塊
- base.css 基本共用
- layout.css 布局，版面
- themes.css 主題
- columns.css 專欄
- font.css 文字、字體
- forms.css 表單
- mend.css 補丁
- print.css 打印
