我們羅列了十幾條相關的知識與注意點，大家可以係統的探討一下，讓我們寫的Web頁面開啟更加流暢。
請不要告訴我，你看不懂E文，只是你不願意看！！！
一、風格系統如何打破規則
1.1、ID 規則
第一類由那些以 ID 選擇器為鍵選擇器的規則所組成。
button#backButton { } /* 這是一條 ID 分類規則*/
#urlBar[type="autocomplete"] { } /* 這是一條 ID 分類規則*/
treeitem > Treerow>treecell#myCell:active{} /*這是一個ID 分類的規則*/
1.2、類別規則
如果一個規則指定了一個類別作為其鍵選擇器，那麼它就屬於這個類別。
button.toolbarButton { } /* 基於類別的規則 */
.fancyText { } /* 基於類別的規則 */
menuitem > .menu-left[checked="true"] { } /* 基於類別的規則*/
1.3、標籤規則
如果沒有將類別或ID 指定為鍵選擇器，則規則的下一個潛在類別是標籤類別。如果規則指定了一個標籤作為其鍵選擇器，則該規則屬於此類。
td { } /* 基於標籤的規則 */
treeitem > treerow { } /* 基於標籤的規則 */
input[type="checkbox"] { } /基於標籤的規則*/
:table { } /* 一般規則 */
[hidden="true"] { } /* 一般規則 */
* { } /* 一般規則*/ tree > [collapsed="true"] { } /* 通用規則*/
2、樣式系統如何匹配規則
樣式系統透過從最右邊的選擇器開始匹配規則，通過規則的選擇器向左移動。只要您的小子樹繼續簽出，樣式系統就會繼續向左移動，直到它匹配規則或因不匹配而退出。
您的第一道防線是根據鍵選擇器的類型進行的規則過濾。此分類的目的是過濾掉規則，以便您甚至不必浪費時間嘗試匹配它們。這是大幅提高效能的關鍵。您甚至需要檢查給定元素的規則越少，樣式解析速度就越快。舉例來說，如果您的元素有 ID，則只會檢查與您的元素 ID 相符的 ID 規則。只會檢查在您的元素上找到的類別的類別規則。只會檢查與您的標籤相符的標籤規則。通用規則將始終受到檢查。
確保規則不會出現在通用類別中！
3.2、不要使用標籤名稱或類別來限定 ID 分類規則
如果您有一個以 ID 選擇器作為其鍵選擇器的樣式規則，則不必費心將標籤名稱新增至規則。ID 是唯一的，因此您無緣無故地減慢了匹配速度。
