網頁切圖div+css命名規則

內容：content/container                導航：nav 　　               側欄：sidebar 　 　  
欄目：column                                標誌：logo 　　    　頁面主體：main 　　    
廣告：banner                                熱點：hot                        新聞：news              
下載：download                         子導航：subnav                 菜單：menu
搜索：search                                 頁腳：footer                   滾動：scroll      
版權：copyright                      友情連接：friendlink           子菜單：submenu     
內容：content                            標籤頁：tab                 文章列表：list           
註冊：regsiter                        提示信息：msg                   小技巧：tips                                      
加入：joinus                           欄目標題：title                       指南：guild                   
服務：service                                狀態：status                   投票：vote                   
    尾：footer                           合做夥伴：partner             登陸條：loginbar
頁面外圍控制總體佈局寬度：wrapper 　　                      左右中：left right center 　　            

(二)註釋的寫法: 
/* Footer */ 
內容區 
/* End Footer */ 
 
(三)id的命名: 

(1)頁面結構 
容器: container           頁頭：header                  內容：content/container            
頁面主體：main          頁尾：footer                    導航：nav                   
側欄：sidebar             欄目：column              左右中：left right center 
頁面外圍控制總體佈局寬度：wrapper    

(2)導航 
導航：nav 
主導航：mainbav 
子導航：subnav 
頂導航：topnav 
邊導航：sidebar 
左導航：leftsidebar 
右導航：rightsidebar 
菜單：menu         子菜單：submenu         標題: title       摘要: summary 

(3)功能 
標誌：logo 
廣告：banner 
登錄：login 
登陸條：loginbar 
註冊：regsiter 
搜索：search 
功能區：shop 
標題：title 
加入：joinus 
狀態：status 
按鈕：btn 
滾動：scroll 
標籤頁：tab 
文章列表：list 
提示信息：msg 
當前的: current 
小技巧：tips 
圖標: icon 
註釋：note 
指南：guild 
服務：service 
熱點：hot 
新聞：news 
下載：download 
投票：vote 
合做夥伴：partner 
友情連接：link 
版權：copyright 

(四)class的命名: 
(1)顏色:使用顏色的名稱或者16進制代碼,如 
.red { color: red; } 
.f60 { color: #f60; } 
.ff8600 { color: #ff8600; } 
(2)字體大小,直接使用"font+字體大小"做爲名稱,如 
.font12px { font-size: 12px; } 
.font9pt {font-size: 9pt; } 
(3)對齊樣式,使用對齊目標的英文名稱,如 
.left { float:left; } 
.bottom { float:bottom; } 
(4)標題欄樣式,使用"類別+功能"的方式命名,如 
.barnews { } 
.barproduct { } 

注意事項: 
1.一概小寫; 
2.儘可能用英文; 
3.不加中槓和下劃線; 
4.儘可能不縮寫，除非一看就明白的單詞. 
主要的 master.css             模塊 module.css            基本共用 base.css          
主題 themes.css               專欄 columns.css                  打印 print.css   
文字 font.css                     表單 forms.css                      補丁mend.css                  
佈局，版面 layout.css