div#content和#content有什麼區別嗎?

請問:css 中 div#content{……} 和 #content{……} 這兩種寫法有什麼區別嗎?如果沒有區別的話那前者豈不是多此一舉。或者是新舊格式?

碰到過類似的還有 span.content{……} 和 .content{……}


當然有區別。

div#content 無法匹配 &

。如果你的樣式針對的不只是單個特定頁面的靜態輸出並且你明確知道 #content 對應的元素可能不僅是 div,而且這條樣式規則僅用於 div,那麼這裡的限定就可能是必要的。


div#content是限定了選擇id為content的div

【感謝評論區知友曾阿牛指點,css中並不強調id的唯一性,所以有多個元素使用同一id在css中不會受影響,但是由於JS中id調用時有不同元素使用同一id會導致出錯,所以要保證id的唯一性,這麼看的話兩種寫法除了權重多1以外並無甚差別】

另外class是可以給多個不同元素加上的,所以span.content就是限定了選擇的元素種類(span),就不會選上class為content的div或者a什麼的。

另外前面加上元素選擇器的話權重會+1,就是說span.content和.content衝突時選擇前者


id 選擇器的權重是100/個 類和偽類的權重是10/個 元素和偽元素的權重是1/個 所以div#content的權重就是101 #content的權重是100 所以div#content 的優先順序比#content的高


可以用來增加權重,覆蓋前面已經被定義的css屬性,或者在屬性後面加!important也是可以的


首先,不建議在CSS中使用ID選擇器,嚴重降低了樣式的可復用性。建議ID專用來給JS進行DOM操作,提高DOM的選擇效率;Class專用CSS分配樣式表,提高樣式的復用性。

其次,再回答問題div#content權重>#content。確實存在其他知友說的多個頁面使用同一個ID的情況存在,但是ID這個本身就應該像全局變數一樣進行考慮,每個ID都應儘可能簡潔準確的描述出指定DOM的用處,所以基本不應該存在多個頁面會有同一個ID的情況存在,這不合理。

P.S.類似content這種如此概括性的ID真是然並卵的存在。這種ID的定義個人覺得極其不合理。

END


這用法本來就有問題,id就是唯一的,所有不應該存在div#id這種寫法


你們都不按標準來嘛,頁面中ID不是唯一的(⊙o⊙)嗎?所以兩種寫法效果沒有任何區別吧


推薦閱讀:

簡要概述自學前端的5個月(大家來提提意見)?
求靠譜的前端培訓?
WEB前端知識總結
一秒領略年薪百萬是一種什麼體驗!(不學編程也可以掌握的裝X指南)

TAG:CSS | DivCSS | 前端入門 |