2011-03-29 12:03:10
最近忙于網(wǎng)站首頁的改版,完成設計以后,進入到網(wǎng)頁html代碼的書寫階段,除了規(guī)劃代碼的規(guī)則以為,考慮到原先代碼的命名有些混亂,想到應該好好的去規(guī)范下代碼的規(guī)范。
以下整理的一些關于代碼書寫方面的規(guī)范的要求,跟大家分享:
首先說一句css對于現(xiàn)在網(wǎng)頁很重要,要不怎么經(jīng)常有人說用css+什么來制作網(wǎng)頁呢,理所當然,CSS命名規(guī)范也十分重要,規(guī)范它的命名有利于代碼的語義和團隊開發(fā)。
先說說網(wǎng)上流傳的css命名規(guī)范(很多版本)見下表:
DIV | CSS名稱 | 說明 |
---|---|---|
網(wǎng)站公用相關 | ||
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 | 主要內容區(qū)域 |
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 | 網(wǎng)站信息 |
Copyright information etc. | .siteinfoLegal | 法律聲明 |
Designer or other credits | .siteinfoCredits | 信譽 |
Join us | .joinus | 加入我們 |
Partnership opportunities | .partner | 合作伙伴 |
Services | .service | 服務 |
Regsiter | .regsiter | 注冊 |
Status | .status | 狀態(tài) |
電子貿易相關 | ||
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 | 論壇 |
這里說一句,盡量別用”#“定義樣式,應為在調用的時候會使id來調用。這樣就有可能和程序員們使用的id沖突。
下面說說css的常用命名方式:
駱駝式命名法:
正如它的名稱所表示的那樣,是指混合使用大小寫字母來構成變量和函數(shù)的名字。例如,下面是分別用駱駝式命名法和下劃線法命名的同一個函數(shù):
printEmployeePaychecks(); print_employee_paychecks(); |
第一個函數(shù)名使用了駱駝式命名法,函數(shù)名中的每一個邏輯斷點都有一個大寫字母來標記;第二個函數(shù)名使用了下劃線法,函數(shù)名中的每一個邏輯斷點都有一個下劃線來標記。
駱駝式命名法近年來越來越流行了,在許多新的函數(shù)庫和Microsoft Windows這樣的環(huán)境中,它使用得當相多。另一方面,下劃線法是c出現(xiàn)后開始流行起來的,在許多舊的程序和UNIX這樣的環(huán)境中,它的使用非常普遍。
匈牙利命名法:
廣泛應用于象Microsoft Windows這樣的環(huán)境中。Windows 編程中用到的變量(還包括宏)的命名規(guī)則匈牙利命名法,這種命名技術是由一位能干的 Microsoft 程序員查爾斯- 西蒙尼(Charles Simonyi) 提出的。
匈牙利命名法通過在變量名前面加上相應的小寫字母的符號標識作為前綴,標識出變量的作用域,類型等。這些符號可以多個同時使用,順序是先m_(成員變量), 再指針,再簡單數(shù)據(jù)類型,再其它。
例如:m_lpszStr, 表示指向一個以0字符結尾的字符串的長指針成員變量。
匈牙利命名法關鍵是:標識符的名字以一個或者多個小寫字母開頭作為前綴;前綴之后的是首字母大寫的一個單詞或多個單詞組合,該單詞要指明變量的用途。
帕斯卡(pascal)命名法:
與駱駝命名法類似。只不過駱駝命名法是首字母小寫,而帕斯卡命名法是首字母大寫,如:
DisplayInfo(); string UserName; |
二者都是采用了帕斯卡命名法。在C#中,以帕斯卡命名法和駱駝命名法居多。
三種命名規(guī)則的小結:
MyData 就是一個帕斯卡命名的示例
而myData是一個駱駝命名法,它第一個單詞的第一個字母小寫,后面的單詞首字母大寫,看起來像一個駱駝
而iMyData是一個匈牙利命名法,它的小寫的i說明了它的型態(tài),后面的和帕斯卡命名相同,指示了該變量的用途.
您也可以自創(chuàng)命名方式,重在統(tǒng)一、保持。