大家都知道網頁是由DOM樹和CSSOM樹合成渲染樹，
再由瀏覽器繪製而出的。其中CSSOM樹就是由我們所寫的css代碼解析而成的，而合成渲染樹的過程必然涉及到查找DOM，因此高效的CSSOM樹將有助於提升合成渲染樹的速度，進而降低頁面的首屏繪製時間。
1、一些建議
首先得了解css的解析規則是從右向左的，原因可參見這篇文章。
嵌套層級不要超過3級
一般情況下，一條css規則的嵌套層級最好不要超過3級，嵌套過深會導致以下問題：
1、css文件體積變大；
2、造成性能浪費，影響渲染的速度(有待考證)，可參考1
3、過於依賴HTML文檔結構，不易維護
少用通配符*和屬性選擇器，如a[href='']
在做樣式重置時，不要這樣:
*{
padding:0;
marging:0;
}
而應該把具體哪些元素需要重置都列出來
在嵌套規則中儘量使用類名而不是元素選擇器(div ，span 等),影響可讀性
使用transform和opacity來實現動畫，不要使用left和top
2、一些問題
SASS導致的嵌套問題
使用sass寫css時經常會出現嵌套過深問題，解決方案是合理控制html的層級，儘量使用嵌套淺的html結構
分享到:
閱讀更多 易學前端筆記 的文章
