頁(yè)面命名規(guī)范
如：
? 首頁(yè)：index/home
? 關(guān)于我們：about_us
? 聯(lián)系我們：contact_us
? 產(chǎn)品中心：product
? 產(chǎn)品詳情頁(yè)：pro_center
? 新聞中心：news
? 新聞詳情頁(yè)：news_center
? 服務(wù)中心：service
? 登陸頁(yè)：login
? 注冊(cè)頁(yè)：reg
? 訂單頁(yè)：order
? 訂單提交成功頁(yè)：order_success
? 訂單提交失敗頁(yè)：order_error
? 提交頁(yè)面：submit
? 修改密碼：update
? 我的購(gòu)物車：shop_cart
? 確認(rèn)訂單：confirm_order
? 支付頁(yè)：pay
? 支付成功頁(yè)：pay_success
? 支付失敗頁(yè)：pay_error
? 會(huì)員中心：member
? 地址列表：address
? 新增地址：add_address
? 個(gè)人資料修改：update_data
? 購(gòu)買記錄頁(yè)：pur_history
? 點(diǎn)評(píng)頁(yè)：comments
? 搜索頁(yè)：search
? 地圖頁(yè)：map
id與class命名
如：
? 地圖：map
? 頭部：header
? 中部：middle
? 底部：footer
? 內(nèi)容：content
? 導(dǎo)航：nav
? 二級(jí)導(dǎo)航：childNav
? 菜單：ment
? 更多：move
? 列表：list
? 圖片：pic
?縮略圖：thumb-pic
? 分頁(yè)：page
? 輪播圖：slider
? 廣告圖：banner
? 新聞列表：newsList
? 產(chǎn)品列表：proList
? 搜索欄：search
? Logo圖：logo
? 中部?jī)?nèi)容左邊：mid-left
? 中部?jī)?nèi)容右邊：mid-right
? 中部?jī)?nèi)容上邊：mid-top
? 中部?jī)?nèi)容下邊：mid-bot
? 按鈕：btn
? 提交按鈕：sub
? 表格：tab
資源文件夾命名：
如：
CSS 文件夾：style
Javascript 文件夾：js
圖片資源文件夾：images
字體資源文件夾：fonts
常用的css命名規(guī)則
頭：header
內(nèi)容：content/container
尾：footer
導(dǎo)航：nav
側(cè)欄：sidebar
欄目：column
頁(yè)面外圍控制整體布局寬度：wrapper
左右中：left right center
登錄條：loginbar
標(biāo)志：logo
廣告：banner
頁(yè)面主體：main
熱點(diǎn)：hot
新聞：news
下載：download
子導(dǎo)航：subnav
菜單：menu
子菜單：submenu
搜索：search
友情鏈接：friendlink
頁(yè)腳：footer
版權(quán)：copyright
滾動(dòng)：scroll
內(nèi)容：content
標(biāo)簽頁(yè)：tab
文章列表：list
提示信息：msg
小技巧：tips
欄目標(biāo)題：title
加入：joinus
指南：guild
服務(wù)：service
注冊(cè)：regsiter
狀態(tài)：status
投票：vote
合作伙伴：partner
(二)注釋的寫法:
/* Footer */
內(nèi)容區(qū)
/* End Footer */
(三)id的命名:
(1)頁(yè)面結(jié)構(gòu)
容器: container
頁(yè)頭：header
內(nèi)容：content/container
頁(yè)面主體：main
頁(yè)尾：footer
導(dǎo)航：nav
側(cè)欄：sidebar
欄目：column
頁(yè)面外圍控制整體布局寬度：wrapper
左右中：left right center
(2)導(dǎo)航
導(dǎo)航：nav
主導(dǎo)航：mainbav
子導(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
注冊(cè)：regsiter
搜索：search
功能區(qū)：shop
標(biāo)題：title
加入：joinus
狀態(tài)：status
按鈕：btn
滾動(dòng)：scroll
標(biāo)簽頁(yè)：tab
文章列表：list
提示信息：msg
當(dāng)前的: current
小技巧：tips
圖標(biāo): icon
注釋：note
指南：guild
服務(wù)：service
熱點(diǎn)：hot
新聞：news
下載：download
投票：vote
合作伙伴：partner
友情鏈接：link
版權(quán)：copyright
(四)class的命名:
(1)顏色:使用顏色的名稱或者16進(jìn)制代碼,如
.red { color: red; }
.f60 { color: #f60; }
.ff8600 { color: #ff8600; }
（2）字體大小,直接使用”font+字體大小”作為名稱,如
.font12px { font-size: 12px; }
.font9pt {font-size: 9pt; }
(3)對(duì)齊樣式,使用對(duì)齊目標(biāo)的英文名稱,如
.left { float:left; }
.bottom { float:bottom; }
(4)標(biāo)題欄樣式,使用”類別+功能”的方式命名,如
.barnews { }
.barproduct { }
注意事項(xiàng)::
1.一律小寫;
2.盡量用英文;
3.不加中杠和下劃線;
4.盡量不縮寫钞脂，除非一看就明白的單詞.
主要的 master.css
模塊 module.css
基本共用 base.css
布局偎肃，版面 layout.css
主題 themes.css
專欄 columns.css
文字 font.css
表單 forms.css
補(bǔ)丁 mend.css
打印 print.css
商城頁(yè)面命名
index 主頁(yè)
footprints 我的足跡
collect 我的收藏
about_us 關(guān)于我們
shop_cart 購(gòu)物車
personal 個(gè)人中心
comments 評(píng)論
search 搜索
nearby 附近
order 訂單
activities 活動(dòng)
detail 店鋪詳情
detail_temp 生活超市
sort_list 分類
all_order 增加訂單
pay 支付
success 支付成功
submit 提交
address 地址
add_address 添加地址
two_code 我的二維碼
experience 體驗(yàn)師
supermarkets 生活超市
命名規(guī)則如下：
1.如果是模塊飘蚯，可以這樣前綴：
彈出：pop ? ? ? ? ? ? ? ? ? ?公共：global（縮寫：gb）
標(biāo)題：title,tit ? ? ? ? ? ? ? ?提示：hint?
菜單：menu ? ? ? ? ? ? ? ??信息：info?
預(yù)覽：pvw ? ? ? ? ? ? ? ? ??導(dǎo)航：nav
2.類型：?
按鈕：btn ? ? ? ? ? ? ? ? ? ?文本：txt
段落：p ? ? ? ? ? ? ? ? ? ? ??圖標(biāo)：icon?
顏色：color（縮寫：c） ?背景：bg?
邊框：bor
3.作用：
設(shè)置：set ? ? ? ? ? ? ? ? ? ?添加：add?
刪除：del ? ? ? ? ? ? ? ? ? ?操作：op?
密碼：pw ? ? ? ? ? ? ? ? ? ?導(dǎo)入：inc
4.狀態(tài)：
成功：suc ? ? ? ? ? ? ? ? ?失敻圩：lost ? ? ? ? ? ? ? ?透明：tran
基本上常用的就這么多芬为，大家可以一起來(lái)補(bǔ)充
5.下面我列的幾個(gè)小例子：
文本輸入框： .input_txt
段落文本顏色： .tx_c_p
密碼輸入框： .input_pw
相冊(cè)彈出的設(shè)置層： .pop_set_photo
登錄密碼輸入框： .input_pw_login
日志設(shè)置成功提示： .hint_suc_blogset
公共提示： .hint_gb
......
6.常用的塊命名
頁(yè)頭： header ? ? ? ? ? ?登錄條： loginBar
標(biāo)志： logo ? ? ? ? ? ? ? ?側(cè)欄： sideBar
廣告： Banner ? ? ? ? ? ?導(dǎo)航： nav
子導(dǎo)航： subNav ? ? ? ? 菜單： menu
子菜單： subMenu ? ? ? 搜索： search
滾動(dòng)： scroll ? ? ? ? ? ? ? 頁(yè)面主體：main
內(nèi)容： content ? ? ? ? ? 標(biāo)簽頁(yè)： tab
文章列表：list ? ? ? ? ? ? 提示信息：msg
小技巧： tips ? ? ? ? ? ? ?欄目標(biāo)題：title
加入： joinus ? ? ? ? ? ? 指南： guild
服務(wù)： service ? ? ? ? ? ?熱點(diǎn)： hot
新聞： news ? ? ? ? ? ? ?下載： download
注冊(cè)： regsiter ? ? ? ? ? 狀態(tài)： status
投票： vote ? ? ? ? ? ? ? 友情鏈接：friendLink
頁(yè)腳： footer ? ? ? ? ? ? 版權(quán)： copyRight
