CSS 压缩

去除空格、注释和冗余代码,支持实时压缩

输入 CSS

压缩结果

功能介绍

面向 Web 性能优化的 CSS 压缩工具。去除空格注释和冗余代码,实时显示压缩前后大小对比与压缩率,帮助优化页面加载速度,减少带宽消耗。

关键特点

  • 去除空格和换行
  • 去除注释
  • 优化冗余代码
  • 显示压缩前后大小对比

使用教程

  1. 粘贴 CSS 代码到输入框(可粘贴整个 CSS 文件内容)
  2. 点击「压缩 CSS」按钮或等待自动压缩处理
  3. 查看压缩结果和压缩率(通常可减少 20%-40% 体积)
  4. 对比压缩前后的字节数差异,评估优化效果
  5. 点击「复制结果」替换项目中的原始 CSS 文件

使用示例

输入示例:

/* 重置样式 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px 15px;
}

输出结果:

*{margin:0;padding:0;box-sizing:border-box}.container{width:100%;max-width:1200px;margin:0 auto;padding:20px 15px}

常见问题

CSS 压缩能减小多少体积?

通常能减小 20%-40% 的文件体积,具体取决于原始代码的冗余程度。

相关工具

{ } JSON 格式化 | XML 格式化 | Markdown ↔ HTML 转换