早上好,今天 是2019/12/9;天氣陰,歡迎觀看濟南app開發,微信小程序開發,系統開發官網。
1、盡量將樣式寫在單獨的css文件里面,在head元素中引用
有時候為了圖方便或者快速搞定功能,我們可能會直接將樣式寫在頁面的style標簽或者直接內聯在元素上,這樣雖然簡單方便,但是后期維護起來是比較麻煩的。將代碼寫成單獨的css文件有幾點好處:
(1)內容和樣式分離,易于管理和維護
(2)減少頁面體積
(3)css文件可以被緩存、重用,維護成本降低
(4)山東文匯提醒您:為了維護好同事之間的關系,請一定要規范寫代碼,記得添加注釋和縮進!!!

2、不使用@import
這條手段已經是眾所周知,這里簡單提一下,@import影響css文件的加載速度
3、盡量較少的使用高性屬性:浮動、定位;去除空規則;屬性值為0時,不加單位;屬性值為浮點數0.**時,可以省略小數點前的0;
標準化各種瀏覽器前綴,帶瀏覽器前綴的在前,標準的在后;
4、避免使用復雜的選擇器,層級越少越好
有時候項目的模塊越來越多,功能越來越復雜,我們寫的CSS選擇器會內套多層,越來越復雜。
建議選擇器的嵌套最好不要超過三層,比如:
.header .logo .text{}
可以優化成
.haeder .logo-text{}
簡潔的選擇器不僅可以減少css文件大小,提高頁面的加載性能,瀏覽器解析時也會更加高效,也會提高開發人員的開發效率,降低了維護成本。
5、精簡頁面的樣式文件,去掉不用的樣式
很多時候,我們會把所有的樣式文件合并成一個文件,但是這樣有一個問題:很多其他頁面的CSS同時引用到當前頁面中,而當前頁面并沒有用到它們,這種情況會造成兩個問題:
(1)樣式文件偏大,影響加載速度
(2)瀏覽器會進行多余的樣式匹配,影響渲染時間。
正確的處理方法是根據當前頁面需要的css去合并那些當前頁面用到的CSS文件。
分享完畢,感謝觀看濟南app開發的官網,以后還會和大家分享學習方面的小知識,歡迎大家關注山東文匯官方網站,我們是專業app開發,微信小程序開發,系統開發的專業互聯網公司。



