常用的CSS命名規則

應該很多人都會有PO這種東西,但是對剛學CSS的人真的很重要,尤其像我這種英文不好的人,這些是必背的的單字喔^^,這些資料只是我在學習的時候,參考別人的資料之後用自己的思考整理出來的,像參考書寫的真的都看不懂,通常翻第一頁之後,永遠就不會再翻第二頁了,當然我也是摟.....

一、常用的CSS命名規則

頭:header內容:content導覽:nav側欄:sidebar專欄:column
頁底:footer左:left右:right中:center登入條:loginbar
標誌:logo橫幅:banner頁面主體:main熱門:hot新聞:news
下載:download子導覽:subnav項目:menu子項目:submenu搜尋:search
友站連結:friendlink版權:copyright滾動:scroll標籤頁:tab文章列表:list
提示信息:msg小技巧:tips欄目標題:title加入:joinus指南:guild
服務:service註冊:regsiter狀態:status投票:vote合作夥伴:partner
內部:inner區域:area/region   

二、註釋的寫法:
/* Footer */
內容區
/* End Footer */

三、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.儘量不縮寫,除非一看就明白的單詞。

一些CSS樣式表檔案命名:

主要的 master.css
模塊 module.css
基本共用 base.css
佈局,版面 layout.css
主題 themes.css
專欄 columns.css
文字 font.css
表單 forms.css
補丁 mend.css
列印 print.css