一、寫在前面

css的優化方案，之前沒有提及，所以接下來進行總結一下。

二、具體優化方案

2.1、加載性能

1、css壓縮：將寫好的css進行打包，可以減少很多的體積。
2、css單一樣式：在需要下邊距和左邊距的時候，很多時候選擇：margin:top 0 bottom 0,但是margin-bottom:bot tom;margin-left:left;執行效率更高。
3、減少@import,而建議使用link,因為后者在頁面加載時一起加載，前者是等待頁面加載完成之后再進行加載。

2.2、選擇器性能

1、關鍵選擇器：選擇器的最后面的部分為關鍵選擇器。css選擇器是從右向左進行匹配的。當使用后代選擇器的時候，瀏覽器會遍歷所有子元素來確定是否是指定的元素等等。
2、如果規則擁有ID選擇器作為其關鍵選擇器，則不要為規則增加標簽。過濾掉無關的規則。
3、避免使用通配符規則，如果*{}，計算次數驚人，只對需要用到的元素進行選擇。
4、盡量少的區隊標簽進行選擇，而使用class。
5、了解哪些屬性是可以通過繼承而來的，然后避免對這些屬性重復指定規則。

2.3、渲染性能

1、慎重使用高性能屬性：浮動，定位。
2、盡量減少頁面的重排和重繪。
3、去除控規則，{}。空規則的產生的原因一般來說是為了預留樣式。去除這些空規則則無疑能減少css文檔體積。
4、屬性值為0時，不加單位。
5、屬性值為浮動小數0.***，可以省略小數點之前的0。
6、標準化各種瀏覽器前綴，帶瀏覽器前綴的在前。標準屬性在后。
7、不使用@import前綴，它會影響css的加載速度。
8、選擇器優先嵌套，盡量避免層級過深。
9、css雪碧圖：同一頁面相近部分的小圖標，方便使用，減少頁面的請求次數，但是同時圖片本身不變大，使用時，優劣考慮清楚使用。
10、正確使用display的屬性，由于display的作用，某一些樣式組合會無效，徒增樣式體積的同時也影響性能。

2.4、可維護性和健壯性

1、將具有相同內容的樣式抽離出來，整合并通過class在頁面中進行使用，提高css的可維護性。
2、樣式和內容分離，將css代碼定義到外部css中。