關(guān)于ID選擇器
和class選擇器不同，這里使用#
class的值不同標(biāo)簽可以發(fā)生重復(fù)。但是id不允許！！！
id選擇器不能結(jié)合使用
id屬性通常和js配合使用

CSS Code復(fù)制內(nèi)容到剪貼板

#label {   
    background-color: red;   
}  

思考
最近我在對(duì) CSS 的樣式進(jìn)行一些性能測(cè)試，然后我的一些好友問我：為什么你不使用 IDs 來作為頁(yè)面上一些特定的內(nèi)容部分呢？
這個(gè)問題很難回答，有下面幾個(gè)理由：
1.頁(yè)面中的該元素?zé)o法重用
2.螺旋式下降導(dǎo)致的特異性
3.通過 IDs 用來標(biāo)識(shí)一些非常特殊的內(nèi)容，但犧牲了抽象性
4.性能方面可通過其他方式來解決
5.下面我們針對(duì)這四點(diǎn)進(jìn)行深入探討。

無法重用頁(yè)面的元素
IDs 對(duì)程序員來說相當(dāng)于是單例，一個(gè)頁(yè)面中不允許存在兩個(gè)相同的 id（當(dāng)然瀏覽器不會(huì)報(bào)錯(cuò)就是了），這就意味著你不可能重用某個(gè)元素，相當(dāng)于是一對(duì)一的關(guān)系。而根據(jù)我的速度測(cè)試，如果一段 CSS 代碼只對(duì)一個(gè)元素起作用對(duì)速度并不利，同時(shí)也帶來了 CSS 膨脹的額外開銷。

由螺旋式下降導(dǎo)致的特異性
CSS 關(guān)于重載的兩個(gè)方法：
1.級(jí)聯(lián): (任何下一級(jí)的元素都可以重寫上一級(jí)CSS規(guī)則)
2.特異性: the idea of creating weight by using weighted selectors.
為什么我說這里是一個(gè)螺旋式下降，因?yàn)闉榱艘剌d一個(gè)優(yōu)先級(jí)很高的規(guī)則，我必須給它設(shè)置添加再高的優(yōu)先級(jí)。

CSS Code復(fù)制內(nèi)容到剪貼板

.ModuleOfficeList .property-checkbox input {display:block;margin-bottom:8px;_border:0px !important;}    
.ModuleOfficeList .property-checkbox,   
.ModuleOfficeList .new-icon,   
.ModuleOfficeList .open-icon {display:block}    
….uid-officelistings .property-checkbox {display:none !important; }  

上面是我在 2005 年的一段真實(shí)的代碼，上面的代碼我必須在最后使用 !important 規(guī)則來對(duì)選擇器規(guī)則進(jìn)行重新排序。這很不好。一旦我們這樣做……它需要我們更多的時(shí)間去追捕父ID，我們將推翻當(dāng)前的特異性。這是不友好的而且不利于維護(hù)，最終你會(huì)掉進(jìn)入自己挖好的洞，只有重構(gòu)才能擺脫這個(gè)噩夢(mèng)。

另一方面：
我聽到少數(shù)的一些聲音關(guān)于使用 ID 選擇器的好

使用 ID 選擇器更快
是的，這一點(diǎn)的確沒錯(cuò)，而且我也曾經(jīng)證明過。但是性能的表現(xiàn)微乎其微，但當(dāng)你使用嵌套其他選擇器時(shí)性能就下降了：

CSS Code復(fù)制內(nèi)容到剪貼板

#profile-module {…}    
#profile-module li {…}