CSS 美化與壓縮的運作原理
在網頁開發過程中，CSS 程式碼會經歷兩種截然不同的狀態：便於人類閱讀的「開發版」，以及便於瀏覽器快速載入的「生產版」。
當多位開發人員共同維護同一個樣式表時，程式碼的縮排和格式往往會變得雜亂無章。CSS 美化（Beautification）透過重新縮排並加入空格與換行，將混亂的樣式表重整為結構清晰、易於閱讀和修改的格式。
相反，CSS 壓縮（Minification）則是為了提升網頁載入速度。瀏覽器在解析 CSS 時，並不需要任何空格、換行或開發者留下的註解。壓縮過程會移除這些多餘的字元，甚至縮短特定的屬性值（例如將顏色值 #ffffff 縮短為 #fff），從而縮減檔案體積，加快傳輸速度。
兩種壓縮強度：安全與最佳化
本工具提供兩種不同的壓縮模式，以滿足不同的部署需求：
| 壓縮強度 | 處理機制 | 規則順序 | 適用場景 |
|---|---|---|---|
| 安全 | 僅移除空格、換行和一般註解，並縮短數值（如顏色值）。保留廠商前綴（vendor prefixes）及現代語法。 | 完全不變，所有規則保留在原始位置。 | 依賴特定層疊順序（Cascade Order）的複雜樣式表。 |
| 最佳化 | 除了安全模式的處理外，還會合併重複的選擇器和規則，以達到最小的檔案體積。 | 可能會重新排列規則的順序。 | 追求極致載入速度，且已確認重排順序不影響轉譯效果的頁面。 |
在兩種模式下，以 /*! … */ 標記的特定註解（通常用於版權聲明或授權資訊）都會被完整保留，不會被刪除。
輸入限制與錯誤處理
使用本工具處理 CSS 時，請留意以下規則與系統提示：
- 容量限制：輸入的 CSS 程式碼最大限制為 500,000 個字元。如果超過此限制，工具會顯示「樣式表太大，無法處理。請嘗試較小的檔案。」。
- 空輸入與語法錯誤：若輸入框內無任何內容，或壓縮器處理後輸出為空字串，系統會判定為語法問題，並顯示「找不到可壓縮的 CSS，請檢查輸入是否有語法錯誤。」。
- 解析失敗：若輸入的 CSS 因結構嚴重損壞而無法解析，工具將顯示「無法處理此 CSS。」。
本機處理與私隱保護
你的 CSS 會在瀏覽器本機進行美化和壓縮，不會上傳至 BroBroGo。所有運算均在你的本機瀏覽器內即時完成。
常見問題
「美化」與「壓縮」有何分別？
「美化」會重新縮排並加入空格，讓樣式易讀易改；「壓縮」正好相反，會移除瀏覽器不需要的空格和註解，並縮短顏色等數值，使檔案更小、載入更快。開發時使用美化，發佈前進行壓縮。
「安全」與「最佳化」壓縮設定有何作用？
「安全」模式只會移除空格和註解並縮短數值，保留所有規則的原始位置。「最佳化」模式則更進一步，合併重複的選擇器和規則以縮減檔案體積——這可能會重新排列規則順序，因此如果樣式表依賴原始順序，建議在發佈前快速檢查。以 /*! … */ 標記的註解在兩種模式下都會保留。
壓縮會改變網頁的外觀嗎？
在「安全」模式下不會——樣式的轉譯效果完全相同。它只會摺疊空格、移除一般註解，並將數值重寫為較短的等效形式（例如將 #ffffff 寫成 #fff），且絕不改動廠商前綴（vendor prefixes）或現代語法。「最佳化」模式還會合併規則，雖然在絕大多數樣式表上視覺效果一致，但如果你的樣式依賴規則順序，則值得核對一下。