跳到主要内容

CSS 压缩

开发者工具

把样式表里的注释、缩进和多余空白去掉。和那些一把梭的替换不同,工具会先识别字符串和 url(),所以 content: "a b" 里的两个空格还能活着。

正在加载工具…

使用说明

3 步
  1. 01

    把 CSS 粘进输入框

  2. 02

    需要给同事留调试信息就勾上「保留注释」,默认会删掉

  3. 03

    右侧直接出结果,点复制或下载拿走

常见问题

5 个问题
Q1会压坏字符串里的空格吗?

不会。这是压缩器最经典的坑:很多工具用正则全局替换空白,会把 content: "a b" 压成 "a b",反引号里的图标字符也会坏掉。本工具逐个字符扫描,引号内和 url() 内原样保留。

Q2能省多少体积?

一般 20%–40%,手写、缩进很深的文件省得更多。不过服务器开了 gzip 之后差距会变小,因为 gzip 本来就擅长压重复空白——真正的大头是删注释和缩短类名,后者本工具不做。

Q3@media 查询会被破坏吗?

不会。只在 { } ; : , 这些分隔符附近去掉空白,@media (max-width: 600px) and (orientation: landscape) 之间的空格会保留下来。

Q4支持 SCSS / Less 吗?

不支持。带嵌套规则、变量、// 行注释的预处理器语法不是合法 CSS,会解析出错。请先编译成 CSS 再压。

Q5会不会改掉属性顺序或合并选择器?

不会。工具只动空白和注释,声明的顺序和内容一个字都不改,所以可以放心用到生产环境——但这也意味着它做不到「把 .a{color:red}.b{color:red} 合并成 .a,.b」这种优化。

开发者工具