天天看點

CSS優化需要注意的15個細節

1、不要使用過小的圖檔做背景平鋪。這就是為何很多人都不用 1px 的原因,這才知曉。寬高 1px 的圖檔平鋪出一個寬高 200px 的區域,需要 200*200=40, 000 次,占用資源。 

2、無邊框。推薦的寫法是 border:none;,哈哈,我一直在用這個。 border:0; 隻是定義邊框寬度為零,但邊框樣式、顔色還是會被浏覽器解析,占用資源。

3、慎用 * 通配符。所謂通配符,就是将 CSS 中的所有标簽均初始化,不管用的不用的,過時的先進的,一視同仁,這樣,大大的占用資源。要有選擇的初始化标簽。 

4、CSS 的十六進制顔色代碼縮寫。習慣了縮寫及小寫,這才知道,原來不是推薦的寫法,為的是減少解析所占用的資源。但同時會增加檔案體積。孰優孰劣,有待仔細考證。 

5、樣式放頭上,腳本放腳下。不内嵌,隻外鍊。

6、堅決不用 CSS 表達式。 

7、使用 引用樣式表,而不是通過 @import 導入。 

8、一般來說,PNG 比 GIF 要小,小得多。再者,GIF 中有多少顔色是被浪費的,很值得優化。 

9、千萬不要在 HTML 中縮放圖檔,一者不好看,二者占資源。 

10、正文字型最好用偶數,12px、14px、16px,效果非常好。特例,15px。 

11、block、ul、ol 等上下留出至少一倍行距,左側至少兩倍行距,右側随意。 

12、段落之間,至少要有一倍行距。 

13、強行指定某些元素的 line-height,正文 1.6 倍于文字大小,标題 1.3 倍。 

14、中文标點用全角。英文夾雜在中文中,左右空格,半角。 

15、中文字型的粗體和斜體,遠離較好,利民利己。

其他參考:1、http://www.52css.com/article.asp?id=787