如何壓縮css文件

壓縮方法：1、使用DW軟體開啟CSS檔案；2、使用「尋找與取代」工具刪除檔案中的全部空格；3、將樣式程式碼中多餘的分號刪除；4、刪除多餘空行，讓程式碼都排成一排（緊貼一起）即可。

本教學操作環境：windows7系統、CSS3&&AdobeDreamweaverCS6版、Dell G3電腦。

CSS程式碼壓縮從哪些方面入手

網頁開發好後，將要發佈到網站的CSS程式碼直接縮減壓縮，例如刪除空格、去掉換行、去掉多餘分號等

當然有的CSS程式碼可以進行最佳化也是可以大幅減少程式碼量從而減少檔案大小。

壓縮css檔案的方法 

使用DW軟體的尋找與取代工具進行取代壓縮CSS程式碼。

1、DW軟體開啟CSS檔案

2、刪除空格壓縮程式碼

2-1：使用快速鍵“Ctrl F”，調出尋找與取代工具選項卡。

2-2：在尋找處鍵入（輸入）一個英文半角小寫「空格」

在「尋找」輸入框中輸入一個空格

在「尋找」輸入框中輸入一個空格，「替換」的輸入框中無需填入然後字元或程式碼，這樣在執行替換時候，相當於把空格替換為沒有字符，相當於刪除空格位置。

2-3：點選「替換全部」

點選「替換全部」後，即可將多餘的空格位置刪除完成，完成壓縮一部分。

3、將多餘的分號刪除

在CSS程式碼中，每個CSS選擇器內的最後一個CSS樣式的結束是不需要「分號」結束的，換句話說每個選擇器內即「後花括號」前是不需要分號結束最後一個CSS樣式的。

同樣使用DW軟體“查找與替換”功能刪除掉，避免刪除錯其它“分號”，這個時候在“查找與替換”選項卡中“查找”輸入框中填寫“;}”（分號後花括號），在“替換”輸入框中只輸入“}”（後花括號），然後點擊“替換全部”，即可完成刪除多餘分號符號。

4、刪除多餘空行，讓程式碼都排成一排（緊貼在一起）

可以手動刪除空白行，也可以使用DW軟體快速刪除空白行，具體刪除壓縮如下。

4-1：首先DW開啟CSS檔案程式碼

4-2：選取空白行

先將滑鼠遊標移到選擇器開頭，然後點選滑鼠左鍵不放同時往上拉到上一個選擇器結束前（上一個CSS樣式選擇器後花括號後），這個時候即可選取空白行，此時選取空行為藍色區域。

4-3：調出“尋找與替換”工具

#在選取後放開滑鼠左鍵後，使用快捷鍵“Ctrl F” ，即可呼叫出「尋找與取代」選項卡，此時「尋找與取代」標籤的「尋找」輸入框中即可自動填上剛選取好的空白行。

4-4：點選「替換全部」完成壓縮

#在「替換」輸入框無需再輸入什麼字元或程式碼，直接點選「替換完成”，完成替換。

快速使用DW軟體進行幾步操作即可完成對CSS程式碼（檔案）壓縮精簡。

css壓縮的好處：

1、減少了檔案的體積

2、減少了網路傳輸量和頻寬佔用

3、減少了伺服器的處理的壓力

4、提高了頁面的渲染顯示的速度

（學習影片分享：css影片教學 ）

以上是如何壓縮css文件的詳細內容。更多資訊請關注PHP中文網其他相關文章！