在CSS中,我們常常使用小數(shù)點(diǎn)來為元素指定類名、ID名或?qū)傩悦@纾?/p>
.wrapper { width: 100%; } #header { background-color: #333; } input[type="text"].search { border: 1px solid #ccc; }
小數(shù)點(diǎn)在CSS中的使用方法分類如下:
- 類選擇器:使用小數(shù)點(diǎn)加名稱來指定樣式類。類名可以定義多個(gè)樣式,一個(gè)元素可以有多個(gè)類名。
- ID選擇器:使用#符號(hào)加名稱來指定ID名。ID名只能在文檔中唯一定義一次,不應(yīng)同時(shí)出現(xiàn)多個(gè)元素。
- 屬性選擇器:使用小數(shù)點(diǎn)加屬性名的方式選擇元素。如input[type="text"].search表示選擇type屬性為"text"、class屬性為"search"的input元素。
需要注意的是,CSS的書寫順序是由選擇器的特殊性(Specificity)決定的。特殊性是一個(gè)衡量選擇器權(quán)重的數(shù)字,值越大則權(quán)重越高,樣式也越優(yōu)先應(yīng)用。具體規(guī)則如下:
- ID選擇器的特殊性為1。
- 類選擇器、屬性選擇器和偽類選擇器的特殊性為10。
- 元素選擇器和偽元素選擇器的特殊性為1。
- 通配符、子選擇器、相鄰選擇器和通用兄弟選擇器的特殊性規(guī)則相同,為0。
最后,我們需要謹(jǐn)慎使用小數(shù)點(diǎn)和其他選擇器,切勿濫用和過分復(fù)雜化CSS選擇器,以免影響頁面性能和維護(hù)難度。
下一篇css3懸停圖片放大