CSS 壓縮工具

在同一個地方壓縮和優化 CSS

這款 CSS 壓縮工具透過刪除瀏覽器不需要的每個字元來縮減樣式表體積——包括注釋、空白、換行符以及每條規則末尾多餘的分號——使您發布的檔案位元組更少，但渲染效果完全相同。貼上程式碼或拖入 .css 檔案，壓縮結果立即顯示，並附上精確節省的位元組數和百分比。

它同時也是一款 CSS 格式化工具：一個開關即可在壓縮和反壓縮之間切換，壓縮樣式表的同一工具也能將其還原為可讀、有縮排的程式碼。

會刪除什麼——以及永遠不會碰什麼

當您 壓縮 CSS 時，工具會刪除注釋、折疊所有空白、移除 { } : ; , > + 等符號周圍的空格，並刪除每個右大括號之前的最後一個分號。開啟積極模式還會刪除前導零（0.5em → .5em）和零長度值的單位（0px → 0）。

最關鍵的是，它是無損的。引號字串、url() 值和 calc() 運算式在任何刪除操作之前都會受到保護，因此像 calc(100% - 2rem) 這樣的值會保留所需的空格，背景圖片路徑也絕不會被破壞。許多快速線上壓縮工具會在 calc() 上出錯——這款不會。

壓縮或美化——真正的雙向工具

需要閱讀被壓縮成一行的樣式表？切換到美化模式來反壓縮 CSS：工具重新縮排程式碼，將每個宣告放在單獨的行上，在每個冒號後加空格，並整齊排列選擇器清單。可選擇 2 空格、4 空格或定位字元縮排以符合專案風格。

由於壓縮和美化是可逆的，您可以貼上生產環境中的壓縮 CSS，閱讀、調整後再重新壓縮——所有操作無需離開頁面。

與 cssminifier.com、CleanCSS 和 cssnano 的比較

cssminifier.com 是最常用的線上選項，但它會將您的程式碼上傳到其伺服器。對於專有樣式表——客戶專案、未發布的設計、內部工具——這是真實的風險。CleanCSS 和 cssnano 是 Node.js 函式庫：非常適合自動化流水線，但沒有本地安裝就無法使用。freeformatter.com 的 CSS 壓縮工具和 TopTal 的 CSS 壓縮工具也都是伺服器端處理。

本工具完全在本地用 JavaScript 處理——任何資料都不會被上傳。涵蓋最常見的壓縮優化（空白、注釋、分號、零單位、前導零），並在同一步驟中顯示 gzip 估算值。無需帳號、無需上傳、無需安裝——支援 iPhone、Android、Mac、Windows 和 Linux。

查看節省的位元組——包括 gzip

醒目的統計列會顯示原始大小、輸出大小以及節省的位元組數和百分比，讓您始終清楚知道 CSS 縮減了多少。大小以真實的 UTF-8 位元組為單位，而非字元數，與伺服器實際傳輸的資料一致。

工具還會顯示在瀏覽器本地計算的 gzip 壓縮後大小。壓縮和 gzip 可以疊加——先壓縮原始檔案，再讓伺服器進行 gzip 壓縮——同時看到兩個數字，組合節省效果一目了然。

100% 私密——任何資料都不離開您的瀏覽器

每次壓縮和美化都在瀏覽器中透過 JavaScript 本地執行。您的 CSS 永遠不會被上傳、記錄或儲存，這使其成為壓縮專有、未發布或客戶樣式表的安全場所。無需註冊，除裝置記憶體外沒有任何限制。離線也能使用——頁面載入完成後，斷開網路，壓縮工具仍然正常運作。將這款線上 CSS 壓縮工具加入書籤，隨時需要壓縮 CSS、縮減檔案或閱讀壓縮過的樣式表時使用。