css中id選擇器的命名規(guī)則有哪一些
發(fā)表時間:2023-09-13 來源:明輝站整理相關(guān)軟件相關(guān)文章人氣:
[摘要]這次給大家科普一下css中id選擇器的命名規(guī)則有哪些,給CSS中ID選擇器命名的時候有哪些注意事項,下面就是總結(jié),一起來看一下。大小寫敏感只能包含[a-zA-Z0-9]、-,,其中不能以、-、0-9開頭在CSS的命名規(guī)范中,名稱不能以數(shù)字開始,只能以字母、連字符、下劃線開始。之后可以是字母、連字符...
這次給大家科普一下css中
id選擇器的命名規(guī)則有哪些,給CSS中ID選擇器命名的時候有哪些
注意事項,下面就是總結(jié),一起來看一下。
大小寫敏感
只能包含[a-zA-Z0-9]、-,,其中不能以、-、0-9開頭
在CSS的命名規(guī)范中,名稱不能以數(shù)字開始,只能以字母、連字符、下劃線開始。之后可以是字母、連字符、下劃線或數(shù)字。
同時應(yīng)該注意的是,雖然在HTML4.01及以前的版本不嚴謹,但在XHTML中,CSS中的命名是區(qū)分大小寫。
1.首先說說語義性
所謂語義性,即名字應(yīng)當描述內(nèi)容,而不是描述表現(xiàn),例子如下
?表現(xiàn)型(不提倡)
PurpleBold(紫色粗體)
BigHeading(大號標題)
top-left-box(左上方框)
underlined-and-green(下劃線綠色)
boxLeft(左側(cè)框)
red(紅色)
紅色標示涉及元素的表現(xiàn)形式,這在命名里是不允許的,因為表現(xiàn)形式是變化的,當變化發(fā)生,不僅要修改CSS的class和id名,還要修改html相應(yīng)元素的class和id名,相當麻煩,當你所編輯的是大型網(wǎng)站,出現(xiàn)多處這樣的修改,是非常耗時且頭疼的。所以應(yīng)該盡可能采用適應(yīng)變化的命名,即命名與內(nèi)容緊密相關(guān)。
?語義型(提倡)
sidebar(側(cè)邊欄)
warning(警告)
當然,有些時候適當運用表現(xiàn)來命名會更靈活。如,用bordered(帶邊框)的表現(xiàn)名給網(wǎng)站多處添加同樣的樣式。
記住,最佳方案不是最干凈的那個,也不是最漂亮的那個,與其拘泥成法,不如將思路放開一些。
2.可接受的字符
最佳規(guī)則:始終使用字母、數(shù)字或連字符,并且始終以字母開頭
記住,class和id名稱是區(qū)分大小寫的。
不要使用下劃線,不要以數(shù)字或連字符打頭,不接受“*”,“/”,“\”。雖然新的瀏覽器對生僻字符集的支持功能更多,但不是所有的瀏覽器如此,為了保證兼容性,請遵循最佳規(guī)則吧。
3.慣例
使用一些約定俗稱的慣例名稱,可提高代碼可預(yù)測性,既讓自己和他人容易理解,也有助于屏幕閱讀器和分析器的工作,提高SEO(搜索引擎優(yōu)化)
慣例參照Web前端開發(fā)規(guī)范手冊
4.大小寫
駝峰式(縮寫單詞的每個字母采用同樣的大小寫:pdfLink linkPDF)
連字符
5.命名空間
加前綴,如:wp-users。命名空間需要制定團隊內(nèi)的命名空間約定。
這是防御式CSS采用的技術(shù)之一,通過命名空間隔離代碼,避免沖突,使其不影響原有和未來的代碼。
相信看了本文案例你已經(jīng)掌握了方法,更多精彩請關(guān)注php中文網(wǎng)其它相關(guān)文章!
推薦閱讀:
網(wǎng)頁中的圖片格式應(yīng)該如何選擇
移動端布局中的流式布局是什么原理
讓元素水平垂直居中冷門方法
html+css的垂直居中容器
js中比較運算符應(yīng)如何科學(xué)使用
以上就是css中id選擇器的命名規(guī)則有哪些的詳細內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!
網(wǎng)站建設(shè)是一個廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護的網(wǎng)站。