說明，本篇內容為書籍《高流量網站CSS開發技術》的學習總結，文字出自書本
書不錯，推薦閱讀學習
也可參閱網上的博文
原載:彬Go
鏈接:http://blog.bingo929.com/css-coding-semantic-naming.html
class和id是用來建立CSS到HTML文件內部的銜接
注意，有些選擇器的寫法應考慮瀏覽器兼容問題，如nth-child選擇器，多class選擇器.classA.classB(IE6和以前的版本不能理解)
對於元素class和id命名，有幾件事要放在心上：
- 語義性
- 可接受的字符
- 慣例
- 一致性
1.首先說說語義性
所謂語義性，即名字應當描述內容，而不是描述表現，例子如下
♦表現型（不提倡）
PurpleBold(紫色粗體)
BigHeading(大號標題)
top-left-box(左上方框)
underlined-and-green(下划線綠色)
boxLeft(左側框)
red(紅色)
紅色標示涉及元素的表現形式，這在命名里是不允許的，因為表現形式是變化的，當變化發生，不僅要修改CSS的class和id名，還要修改html相應元素的class和id名，相當麻煩，當你所編輯的是大型網站，出現多處這樣的修改，是非常耗時且頭疼的。所以應該盡可能采用適應變化的命名，即命名與內容緊密相關。
♦語義型（提倡）
sidebar(側邊欄)
warning(警告)
當然，有些時候適當運用表現來命名會更靈活。如，用bordered(帶邊框)的表現名給網站多處添加同樣的樣式。
記住，最佳方案不是最干凈的那個，也不是最漂亮的那個，與其拘泥成法，不如將思路放開一些。
2.可接受的字符
最佳規則：始終使用字母、數字或連字符，並且始終以字母開頭
記住，class和id名稱是區分大小寫的。
不要使用下划線，不要以數字或連字符打頭，不接受“*”，“/”，“\”。雖然新的瀏覽器對生僻字符集的支持功能更多，但不是所有的瀏覽器如此，為了保證兼容性，請遵循最佳規則吧。
3.慣例
使用一些約定俗稱的慣例名稱，可提高代碼可預測性，既讓自己和他人容易理解，也有助於屏幕閱讀器和分析器的工作，提高SEO（搜索引擎優化）
慣例參照Web前端開發規范手冊
4.大小寫
駝峰式（縮寫單詞的每個字母采用同樣的大小寫：pdfLink linkPDF）
連字符
5.命名空間
加前綴，如：wp-users。命名空間需要制定團隊內的命名空間約定。
這是防御式CSS采用的技術之一，通過命名空間隔離代碼，避免沖突，使其不影響原有和未來的代碼。
后續階段的學習：
Microformat(微格式) http://microformats.org/