- 相關推薦
DIV+CSS規范命名大全
我們開發CSS+DIV網頁(Xhtml)時候,比較困惑和糾結的事就是CSS命名，特別是新手不知道什么地方該如何命名，怎樣命名才是好的方法。下面yjbys小編為大家分享DIV+CSS命名規范及參考值~
命名規則說明：
1)、所有的命名最好都小寫
2)、屬性的值一定要用雙引號("")括起來，且一定要有值如class="divcss5",id="divcss5"
3)、每個標簽都要有開始和結束，且要有正確的層次，排版有規律工整
4)、空元素要有結束的tag或于開始的tag后加上"/"
5)、表現與結構完全分離，代碼中不涉及任何的表現元素，如style、font、bgColor、border等
6)、定義，應遵循從大到小的原則，體現文檔的結構，并有利于搜索引擎的查詢。
7)、給每一個表格和表單加上一個唯一的、結構標記id
8)、給圖片加上alt標簽
9)、盡量使用英文命名原則
10)、盡量不縮寫，除非一看就明白的單詞
相對網頁外層重要部分CSS樣式命名：
外套wrap------------------用于最外層頭部header----------------用于頭部主要內容main------------用于主體內容(中部)左側main-left-------------左側布局右側main-right-----------右側布局導航條nav-----------------網頁菜單導航條內容content---------------用于網頁中部主體底部footer-----------------用于底部
DIV+CSS命名參考表：
以下為CSS樣式命名與CSS文件命名參考表，DIV CSS命名集合：
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 |
打印 |
【DIV+CSS規范命名】相關文章：
網頁美工必備的知識：網頁設計命名規范09-08
常見的DIV+CSS錯誤08-30
插花作品的命名方法08-08
插花作品的命名技巧11-19
怎樣給插花作品命名11-14
葡萄酒的命名方法09-03
插花藝術：插花作品的命名技巧05-25
中醫助理醫師考點：疾病命名原則07-26
excel中如何給單元格重命名07-24
微生物檢驗知識之細菌的分類與命名06-07