網站優化之代碼優化之CSS優化

        很多人都注重内容的優化，卻不注意網站結構的優化，網站結構其實有很多地方可以操作。例如代碼優化，常見的可以優化的地方有JS代碼和CSS代碼以及HTML代碼。

　　今天就這兒來說一(yī)下(xià)CSS代碼的常規操作方法，你網站如果想做CSS代碼優化，可以參考一(yī)下(xià)。CSS爲HTML标記語言提供了一(yī)種樣式描述，定義了其中(zhōng)元素的顯示方式。換句話(huà)說你網頁的外(wài)觀，布局，視覺都和它有關。

　　操作要點之一(yī)，引入CSS文件的方式。

　　網頁中(zhōng)使用css共有三種方式，分(fēn)别爲：嵌入式、内聯式、引用式。

　　嵌入式：将css寫在之間，并且用标記進行聲明。

　　内聯式：對html的标記使用style屬性，然後将css代碼直接寫在其中(zhōng)。

　　引用式：将html頁面本身與css樣式分(fēn)離(lí)爲兩個或多個文件，使用時從外(wài)部引入當前頁面。

　　推薦使用第三種，就這兒工(gōng)具認爲這樣維護修改方便，加快網頁顯示速度，減小(xiǎo)頁面體(tǐ)積。

　　操作要點之二，CSS代碼合并收縮。

　　充分(fēn)利用css的繼承和綜合應用，對于這一(yī)點需要有一(yī)定的css基礎才能做到。這個很好學，有很多教程。多個CSS文件如果不是必須分(fēn)開(kāi)，請合并爲同一(yī)個文件，如此浏覽器解讀你的頁面不需要多次打開(kāi)不同的CSS文件。

　　就這兒認爲這樣可以加快服務器的響應，優化用戶體(tǐ)驗，也利于符合百度的算法，盡量控制頁面在3秒内打開(kāi)。

　　操作要點之三，了解CSS常見語法避免拖慢(màn)頁面。

　　減少css嵌套，不要套三層以上，一(yī)般情況下(xià)塊級元素加上類，裏面的内聯元素不用加，css寫的時候塊級class套内聯tag，這樣不僅可以減少css文件大(dà)小(xiǎo)，還能減少性能浪費(fèi)。

　　不使用@import，因爲使用@import影響css文件的加載速度。減少低效代碼的使用，如濾鏡，express表達式，!import引入。

　　避免使用 expression 和 behavior。在頁面渲染的過程中(zhōng)， expression 和 behavior 需要大(dà)量的計算，會大(dà)量地耗費(fèi)浏覽器資(zī)源。

　　大(dà)的誤區：

　　在就這兒工(gōng)具要說一(yī)個就是很多人會建議正式發布網站之前去(qù)壓縮CSS文件，這樣也可以提高浏覽器加載速度。事情是沒錯的，但是除非你後期不想修改頁面，否則會你對維護造成一(yī)定障礙。爲什麽？因爲所謂的壓縮，就是把所有東西擠成一(yī)堆，人類無法閱讀，浏覽器閱讀無障礙。