Output will appear here...Category:minify
Mode:Offline
Version:1.0.0
Access:Free
什麼是 CSS 小調和美化劑？
CSS Minifier & Beautifier 是一個雙向樣式表工具：它透過刪除瀏覽器不需要的所有內容來壓縮 CSS - 評論、空白、冗餘分號、長格式六色和零值上的單元 - 它可以逆轉這個過程，將單行生產捆綁包擴展回可讀、適當縮排的規則。 您從渲染封鎖樣式表中剝離的每個位元組都是瀏覽器下載和解析的位元組，它直接為核心的 Web Vitals 指標提供第一個 Contentful Paint 和最大的 Contentful Paint 等核心。
小人故意保守。 它完全了解字串文字、url() 值和 calc() 表達式，因此它從不刪除 calc(100% - 20px) 所依賴的空白，從不重寫內容字串中的類似顏色的文字，並且從不觸摸區分 div :hover 與 div:hover 的間距。 在典型的手寫樣式表上，您可以在 GZIP 之前預期縮小 25-40%；結合 GZIP 或 Brotli 上的電線，縮小仍然可以剃掉一個有意義的切片，因為壓縮在重複、無評論的輸入上效果更好。
瀏覽器中的所有內容都以 100% 的客戶端運行。 您的 CSS 永遠不會上傳、記錄或儲存在任何伺服器上，這意味著您可以安全地貼上專有的設計系統代碼、未發布的產品樣式或客戶端工作。 載入頁面後，它也可以離線工作 - 當您需要快速縮小通行證而無需接線完整的 PostCSS 或 ESBuild 管道時，它很有用。
這裡的縮小是語法感知，而不是一組尋找和替換規則，這使得在生產樣式表上運行是安全的：字串中的空白、url() 值和屬性選擇器是不存在的，因為刪除它會改變 CSS 匹配的內容。 保留以感嘆號開頭的註釋，這是必須在構建中生存的許可證標頭的約定。
如何使用 CSS minifier & Beautifier？
1
貼上你的 CSS
將您的樣式表放入輸入區域 - 單一規則、組件檔案或完整的生產包。 格式化和已經縮小的 CSS 都被接受。
2
選擇 縮小或美化
按一下 Minify 以壓縮生產，或 Beautify 將縮小程式碼展開到每行一個聲明，規則之間的空行。 對於 Beautify，請先選擇您喜歡的縮排。
3
檢查儲蓄徽章
該工具報告了確切的前後大小和百分比變化（例如“12.4 kb → 8.1 kb，-34%”），因此您確切地知道變換在運送之前為您買了什麼。
4
複製或下載
只需單擊一下即可將結果複製到剪貼簿，或將其下載為 .css 檔案，以便放入您的建置輸出或 CDN。
主要特點
安全、語法感知縮小
尊重字串文字、url() 值和 calc() 間距 - 它在不損壞有效 CSS 的情況下積極壓縮
六角形和零值縮短
將 #FFFFFFFF 改寫為 #FFF，將 0px 改寫為 0，可證明是安全的，擠出額外的位元組以超越普通空格刪除
許可證評論保存
保持 /*!橫幅評論完好無損，因此圖書館許可證標頭在縮小化、匹配標準建置工具行為中生存
一鍵美化
將縮小的捆綁包擴展到可設定的可讀規則，並使用可配置的 2、4 或 8 空間縮排來調試生產問題
Frequently Asked Questions
CSS 縮小是刪除瀏覽器不需要渲染樣式表的每個字元的過程 - 評論、空格、換行、尾隨分號 - 並將 #ffffff 等安全值縮短為 #FFF。 結果是功能相同的 CSS，以更少的位元組，下載和解析更快。 因為樣式表是渲染阻塞，所以較小的 CSS 可以改進像 First Contentful Paint 這樣的指標。
Related Tools
HM&
minify
HTML Minifier & Beautifier
Minify HTML markup for faster page loads or beautify it for readable, indented source
JSON
minify
JSON Minifier
Minify JSON by removing whitespace, or beautify it with clean indentation, with live size-savings stats and exact parser error messages
SF
minify
SQL Formatter
Format messy SQL into readable, indented queries or minify SQL to a single line
CF
coding
CSS Formatter
Beautify messy CSS with clean indentation, or minify it to ship smaller files. Handles nested at-rules, comments, and string literals safely.
Comments
0 comments
No comments yet. Be the first to share your thoughts!
css minifierminify csscss beautifiercss formattercompress csscss optimizerunminify cssreduce css file sizecss compressor