css選擇器的解析順序簡單介紹

antzone發表於2017-04-02
CSS

本章節簡單介紹一下css選擇器的解析順序，感興趣的朋友可以做一下參考:

先看一段簡單的程式碼:

[CSS] 純文字檢視 複製程式碼
.antzone li {
  color:red;
}

可能很多朋友認為css選擇器的解析是從左到右進行的，其實並非如此。

而是從右到左進行解析，首先查詢所有的li元素，然後再查詢滿足在class屬性值為antzone的元素的li元素。

所以要儘可能的縮小查詢的範圍，所以要儘可能的縮小範圍，如果可能的話，上面的程式碼可以寫作:

[CSS] 純文字檢視 複製程式碼
.antzone > li {
  color:red;
}

相關文章