DIV+CSS命名規範記錄
我們開發CSS+DIV網頁(Xhtml)時候,比較困惑和糾結的事就是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 | 滾動 |
標籤頁 | |
er | 居左、中、右 |
新聞 | |
load | 下載 |
er | 廣告條(頂部廣告條) |
電子貿易相關 | |
ucts | 產品 |
ucts_prices | 產品價格 |
ucts_description | 產品描述 |
ucts_review | 產品評論 |
or_review | 編輯評論 |
_release | 最新產品 |
isher | 生產商 |
enshot | 縮略圖 |
常見問題 | |
ord | 關鍵詞 |
博客 | |
m |
CSS文件命名 | 説明 |
, | 主要的 |
模塊 | |
基本共用 | |
佈局,版面 | |
專欄 | |
文字、字體 | |
表單 | |
補丁 | |
打印 |
-
針對dom元素的分析應用
如果這個DOM元素沒有樣式也就談不上操作了。2.我們也可以直接用JS動態的向html裏寫入DOM元素。今天這章我們就講這兩個應用(一)對html裏現有的DOM元素進行操作。我上面説了,對現有的DOM元素進行操作,無非就是對樣式的操作。所以我們首先就要能獲取這個DOM元素的樣...
-
如何理解Javascript的caller,callee,call,apply區別
在提到上述的概念之前,首先想説説javascript中函數的隱含參數:argumentsarguments該對象代表正在執行的函數和調用它的函數的參數。[function.]arguments[n]參數function:選項。當前正在執行的Function對象的名字。n:選項。要傳遞給Function對象的從0開始的參數值...
-
如何理解Javascript的caller,callee,call,apply區別
在提到上述的概念之前,首先想説説javascript中函數的隱含參數:argumentsarguments該對象代表正在執行的函數和調用它的函數的參數。[function.]arguments[n]參數function:選項。當前正在執行的Function對象的名字。n:選項。要傳遞給Function對象的從0開始的參數值...
-
解決PHP中的Cannot modify header information 問題
我就遇到這種問題,網上找到這個解決的方案,就收藏下寫PHP的朋友們肯定遇到過這樣一個問題:通過header函數改變http協議頭的時候,會出現一個類似下面格式的warning:複製代碼代碼如下:Warning:Cannotmodifyheaderinformation-headersalreadysentby這是為什麼呢?因為在...