CSS 格式化

粘贴样式表——哪怕它只有一行——就能重新读懂。每条声明单独一行,嵌套块获得应有的缩进,注释留在它该在的位置。

代码不会离开此页面:格式化在你的浏览器中完成。

使用方法

  1. 把 CSS 粘贴到第一个输入框。
  2. 选择缩进:两个空格、四个空格或制表符。
  3. 复制结果,或点击「压缩」再把它收紧。

实用说明

为什么粗糙的格式化会毁掉样式表

遇到分号和花括号就切分,看上去挺管用,直到文件里出现 content: "a;b",或者 url() 里嵌着 SVG 的 data URI。这两种写法在真实 CSS 中很常见。这个格式化器逐字符读取文件,因此带引号的字符串和注释是整块搬运的,而不会在第一个标点处被斩断。

真正有用的缩进层级

媒体查询、supports 块和现代的嵌套规则各自增加一层,缩进随之跟进。顶层规则之间空一行,于是两千行的样式表读起来是一份块的清单,而不是一堵文字墙。

常见问题

注释会被保留吗?

会。单独的注释独占一行;跟在声明后面的注释仍然跟着它。

它会改动我的 CSS 吗?

不会重命名、重排或删除任何属性。移动的只是空白——样式表的行为与之前完全一致。

代码会发送到服务器吗?

不会。一切都在你的浏览器里运行,保密项目的样式表仍留在你的电脑上。

SCSS 或 LESS 呢?

嵌套规则和注释都能正确排版。变量、mixin 和控制指令会原样通过,但不会被解析理解。

相关工具