談一下良好的CSS命名習慣

點擊右上方紅色按鈕關注“小鄭搞碼事”,每天都能學到知識,搞懂一個問題!

無疑亂七八糟或者無語義命名的代碼,誰看了都會抓狂。就像這樣的代碼:

談一下良好的CSS命名習慣

我想即使是初學者,也不至於會在實際項目中如此命名一個class,但有沒有想過這樣的代碼同樣是很有問題的:

談一下良好的CSS命名習慣

問題在於如果你需要把所有原本紅色的字體改成藍色,那修改後就樣式就會變成:

談一下良好的CSS命名習慣

這樣的命名就會很讓人費解,同樣的命名為.leftBar的側邊欄如果需要修改成右側邊欄也會很麻煩。所以,請不要使用元素的特性(顏色,位置,大小等)來命名一個class或id,您可以選擇意義的命名如:#navigation{…},.sidebar{…},.postwrap{…}

這樣,無論你如何修改定義這些class或id的樣式,都不影響它跟HTML元素間的聯繫。

另外還有一種情況,一些固定的樣式,定義後就不會修改的了,那你命名時就不用擔憂剛剛說的那種情況,如下:

談一下良好的CSS命名習慣

還有清浮動也是。

那麼對於這樣一個段落:

談一下良好的CSS命名習慣

如果需要把這個段落由原先的左對齊修改為右對齊,那麼只需要修改它的className就為alignright就可以了。


分享到:


相關文章: