css書寫原則

1.css選擇符

css選擇符的編寫方式決定了瀏覽器必須執行的匹配次數，而某些類型的css選擇符將會致使瀏覽器嘗試更多匹配，所以開銷比簡單選擇符更高。

ID選擇符

這種類型的選擇符簡單且高效，用於匹配頁面惟一的元素。#id {}

類選擇符.className {}

類型選擇符tagName {}

相鄰兄弟選擇符H1 + #toc {}

子選擇符#toc > li {}

後代選擇符#toc A {}

通配選擇符 * {}

屬性選擇符 [href="#index"] {}

僞類和僞元素  A:hover {}

 

高效css選擇符的關鍵

1）最右邊優先

     事實上，css選擇符是從右到左進行匹配的。

2）編寫高效的css選擇符

     避免使用通配規則：僅使用ID、類選擇符

     不要限定ID選擇符：ID選擇符左邊不用加任何其餘選擇符

     不要限定類選擇符：不要用具體的標籤來限定類選擇符，而是根據實際狀況對類名進行拓展。

     讓規則越具體越好

     避免使用後代選擇符

     避免使用標籤作子選擇符

     依靠繼承

     仔細檢查子選擇符的用途