Utils365

CSS 格式化與壓縮

讓 CSS 重新變得易讀,或壓縮檔案讓網站更快。

貼上 CSS、開啟 .css 檔案,或將檔案拖放到這裡

下一步: HTML 格式化工具 · JavaScript 格式化與壓縮

回報此工具的問題

如何使用 CSS 格式化與壓縮

  1. 貼上 CSS

    貼上樣式表,或開啟、拖放 .css 檔案。輸入時就會即時格式化。

  2. 美化或壓縮

    美化會讓每條規則和屬性各占一行。壓縮會移除註解、空格以及瀏覽器不需要的其他內容。

  3. 複製或下載

    複製結果,或下載為 .css 檔案。壓縮時可以看到前後的大小。

為什麼選擇 Utils365

  • 不只是移除空格

    壓縮器還會把 #ff0000 這類顏色縮寫為 red、拿掉 0 後面的單位,並刪除空的規則。

  • 規則順序不變

    規則絕不會被合併或移動,串接效果與之前完全相同,不會有樣式意外被覆蓋。

  • 保留授權註解

    以 /*! 開頭的註解會保留在壓縮後的檔案中,符合許多開放原始碼授權的要求。

  • 注重隱私

    CSS 在您的瀏覽器中格式化,絕不會上傳。

常見問題

CSS 壓縮後能小多少?

通常小 15–30%,註解多的樣式表會更多。摘要會顯示前後的確切大小與節省的百分比。

壓縮會破壞樣式嗎?

設計上不會。數值只會改寫成意義相同的形式,規則維持原本順序,所以哪條規則生效不會改變。

如何還原壓縮過的 CSS?

貼上壓縮過的 CSS 並選擇美化。每條規則和屬性都會依你選的縮排各占一行。已移除的註解無法復原。

支援 SCSS 或 Less 嗎?

美化能處理大多數 SCSS 和 Less,包括巢狀寫法。壓縮需要純 CSS,請先編譯 SCSS 或 Less。