CSS 压缩工具

CSS 压缩工具会从样式表中删除注释并折叠空白，以减小生产环境的文件体积——更小的下载量，更快的解析和渲染速度。粘贴可读的 CSS，立即获得紧凑的输出，并提供实时的前后体积对比和可调节的压缩级别。

• •空白折叠：具备引号和注释感知能力的压缩器会删除空格、换行和空行，同时保持字符串内容不变
• •注释移除：删除 /* ... */ 注释，或通过保留注释开关保留它们——例如保留许可证声明
• •颜色优化：在通道允许的情况下，将 6 位十六进制颜色和 rgb() 值缩短为 3 位十六进制简写
• •压缩级别：普通模式执行安全的空白、注释和颜色压缩；激进模式还会删除多余的前导零（0.5px → .5px），并删除零值长度中的数字（0px → 0）
• •体积对比：并排查看原始体积、压缩后体积和百分比缩减
• •可下载输出：直接将压缩结果保存为 .css 文件

• •在部署到生产环境前压缩样式表以减少页面加载时间
• •准备一小段 CSS 以内联嵌入 <style> 标签或 HTML 邮件而不使其臃肿
• •在建立完整的 PostCSS 或构建流程之前，快速检查样式表能缩小多少
• •为 CodePen、gist 或静态原型压缩一次性样式表，这些场景中构建步骤并不实际
• •在 Core Web Vitals 或 Lighthouse 审计中将压缩后的体积与性能预算进行比较

1. 1.将 CSS 粘贴到输入编辑器，或上传 .css 文件
2. 2.选择普通或激进压缩，并决定是否保留注释
3. 3.压缩后的输出和体积缩减百分比会自动显示
4. 4.复制输出或下载为 .css 文件
5. 5.在部署前检查前后字节数以确认体积节省

• •激进的去零处理（0px → 0）对长度单位是安全的，但会跳过字符串和注释内容，并且不会触碰 calc() 表达式内部的运算
• •带引号字符串内的空白——font-family 名称、content: "..."、url() 路径——始终会被精确保留；只有字符串和注释之外的结构性空白才会被删除
• •此压缩工具不会重命名类名、合并重复选择器或删除未使用的规则——这些需要像 cssnano 或 PurgeCSS 这样集成于构建工具的优化器

• •这是空白、注释和颜色的压缩，而非完整优化——要实现最大体积缩减（选择器合并、重复规则删除、未使用 CSS 消除），请使用集成于构建工具的压缩工具，如 cssnano 或 PurgeCSS
• •压缩后的输出会失去全部可读性——请始终将原始源代码保留在版本控制之下
• •非常大的样式表在浏览器中完全处理可能较慢——对于生产构建流程，请将压缩集成到 PostCSS 或你的打包工具中，而不是使用一次性的浏览器工具

如果你有压缩过的 CSS 需要阅读或调试，请改用 CSS 美化工具。它会恢复缩进、排序后的属性和一致的间距，使样式表真正可读。