我應該如何優化CSS代碼?有各種CSS3線,如-moz-和-webkit-,border-left-left-radius等。我相信較大的CSS文件會顯着增加頁面加載時間。如何優化CSS代碼?
另一個問題:我寫了相當多的代碼,但其中一些代碼沒有被使用。我有超過2000行的CSS代碼,我打賭大概200-300行可能會被刪除,甚至更多。值得修改所有的代碼嗎?這將需要相當長的一段時間......
我應該如何優化CSS代碼?有各種CSS3線,如-moz-和-webkit-,border-left-left-radius等。我相信較大的CSS文件會顯着增加頁面加載時間。如何優化CSS代碼?
另一個問題:我寫了相當多的代碼,但其中一些代碼沒有被使用。我有超過2000行的CSS代碼,我打賭大概200-300行可能會被刪除,甚至更多。值得修改所有的代碼嗎?這將需要相當長的一段時間......
GZip the files上傳他們在服務器
這將減少文件之前顯著大小
編輯:gzip壓縮的影響 -
通過使用gzip壓縮的。關於Bargaineering的css文件,其大小從28.2K降至7.3K,節省了74.1%。
文件越小,下載越快,用戶可以渲染樣式的速度越快。有各種縮小文件的腳本,我檢查出YUI壓縮機:http://refresh-sf.com/yui/
總是刪除最後一個分號:
body { background: black; color: white; }
到
body { background: black; color: white }
結合多種特性:
.class { margin-top: 10px; margin-right : 20px; margin-bottom: 30px; margin-left: 40px; }
到
.class { margin: 10px 20px 30px 40px; }
使用簡單的顏色(而不是`#FFFFFF, #AABBCC, #FF0000
把#FFF, #ABC, #F00
)
'margin:10'將不起作用(它只適用於'0')。此外,刪除最後一個分號是矯枉過正的。 – 2012-07-21 17:37:31
感謝您的更正。刪除了。 我見過很多關於刪除最後一個分號的建議,我從來沒有看到有人說這是壞的。但是,我更喜歡總是使用分號。這是一種習慣+稍後添加代碼會更容易。 – 2012-07-21 17:52:53
您的左右邊距值是向後的,在縮短的例子中應該是10px 40px 30px 20px。 – austincheney 2012-07-22 12:12:30
Chrome的開發工具可以告訴你哪些CSS規則沒有被使用...... – 2012-07-21 17:31:19
修改你的代碼並不是一個壞主意。 – dave 2012-07-21 17:32:27
如果確保CSS文件被緩存(在瀏覽器中),不管CSS文件有多大都不應該成爲問題...... – 2012-07-21 17:32:32