div+css中命名規範

上次給別人示範div的效果時，寫了css樣式卻一直不能呈現，最後不小心發現自己在寫css樣式時候，給一個class命名為數字開頭的名稱，才想起來自己去年剛學習樣式表時候也出現此問題，最後被我解決掉的，聲明一下css中的名稱不要以數字開頭，最好是字母開頭。

以下是：CSS 命名規範

 

 

XHTML-CSS寫作建議

1. 所有的xhtml代碼小寫
2. 屬性的值一定要用雙引號("")括起來，且一定要有值
3. 每個標籤都要有開始和結束，且要有正確的層次
4. 空元素要有結束的tag或於開始的tag後加上"/"
5. 表現與結構完全分離，代碼中不涉及任何的表現元素，如style、font、bgColor、border等
6. <h1>到<h5>的定義，應遵循從大到小的原則，體現文檔的結構，並有利於搜尋引擎的查詢。
7. 給每一個表格和表單加上一個唯一的、結構標記id
8. 給重要的區塊加上注釋,如：
9. 給圖片加上alt標籤
10. 所有的標籤必須進行合理的嵌套
11. 根項目前必須有元素，宣告使用那一種DTD
12. 根項目必須有xmlns屬性來指定使用http://www.w3.org/1999/xhtml的namespace

 

CSS樣式表規範：

1. id和class命名採用該版塊的英文單詞或組合命名，並第一個單詞小寫，第二個單詞首個字母大寫，如:newRelease（最新產品/new+Release)
2. CSS樣式表各區塊用注釋說明
3. 盡量使用英文命名原則
4. 不用加中杠和底線
5. 盡量不縮寫，除非一看就明白的單詞

 

CSS命名規範

這段時間由於工作的需要對CSS的命名做了一些研究，主要是想讓作出的文檔等規範，更能讓人看懂和讀懂。

DIV	CSS名稱	說明
網站公用相關
Container div	#container	容器
Header or banner div	#header	頁頭部分
Main or global navigation div	#mainNav	主導航
Menu	#menu	菜單
Sub Menu	#submenu	子功能表
Left or right side columns	#sidebarA, #sidebarB	左側邊欄或右側邊欄
Main div	#main	頁面主體
Content div	#content	內容部分
The main content area	#contentMain	主要內容地區
Footer div	#footer	頁尾部分
Tag	#tag	標籤
Message	#msg #message	提示資訊
Tips	#tips	小技巧
Vote	#vote	投票
Friend Link	#friendlink	友情串連
Title	#title	標題
Summary	#summary	摘要
Sub-navigation list	#subNav	二級導航
Search input	#searchInput	搜尋輸入框
Search output	#searchOutput	搜尋輸出和搜尋結果相似
Search	#search	搜尋
Search results	#searchResults	搜尋結果
Copyright information	#copyright	著作權資訊
brand	#branding	商標
branding-logo	#brandingLogo	LOGO
Site information	#siteinfo	網站資訊
Copyright information etc.	#siteinfoLegal	法律聲明
Designer or other credits	#siteinfoCredits	信譽
Join us	#joinus	加入我們
Partnership opportunities	#partner	夥伴
Services	#service	服務
Regsiter	#regsiter	註冊
Status	#status	狀態
電子貿易相關
Products	.products	產品
Products prices	.productsPrices	產品價格
Products description	.productsDescription	產品描述
Products review	.productsReview	產品評論
Editor's review	.editorReview	編輯評論
New release	.newsRelease	最新產品
Publisher	.publisher	生產商
Screen shot	.screenshot	縮圖
FAQ	.faqs	常見問題
Keyword	.keyword	關鍵詞
Blog	.blog	部落格
Forum	.forum	論壇