css中id選擇器的命名規則有哪些

大小寫敏感

只能包含[a-zA-Z0-9]、-,，其中不能以、-、0-9開頭

在CSS的命名規范中，名稱不能以數字開始，只能以字母、連字符、下劃線開始。之后可以是字母、連字符、下劃線或數字。
同時應該注意的是，雖然在HTML4.01及以前的版本不嚴謹，但在XHTML中，CSS中的命名是區分大小寫。

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采用的技術之一，通過命名空間隔離代碼，避免沖突，使其不影響原有和未來的代碼。

相信看了本文案例你已經掌握了方法，更多精彩請關注Gxl網其它相關文章！

推薦閱讀：

網頁中的圖片格式應該如何選擇

移動端布局中的流式布局是什么原理

讓元素水平垂直居中冷門方法

html+css的垂直居中容器

js中比較運算符應如何科學使用

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com