CSS 格式化与美化
粘贴 CSS 或压缩后的 CSS,可美化为带缩进的版本,也可压缩为生产环境用的单行版本。
功能特性
美化 / 压缩一键切换
属性排序
去除重复项
使用方法
1. 把 CSS 粘贴到左侧的输入框。
2. 点击「格式化」美化,或点击「压缩」压缩。
3. 在右侧面板复制格式化后的结果。
关于这个工具
压缩过或被多人手改的 CSS 很难审阅:一整行代码会掩盖重复规则、缺失的分号和样式覆盖。这个格式化工具把样式表重建为每条声明一行,使用两个空格、四个空格或制表符统一缩进,同时完整保留字符串、注释以及 @media、@supports 等嵌套块。“压缩”则反过来,为生产环境去掉注释和多余空白,减小传输体积。你可以直接粘贴代码或拖入 .css 文件,然后复制或下载结果。格式化只改变排版——规则的顺序和含义完全不变,层叠效果和之前一样。
常见问题
格式化会改变 CSS 的效果吗?
不会。格式化只改变空白和换行,选择器、声明及其顺序都保持不变,所以优先级和层叠规则与之前完全相同。
压缩 CSS 能节省多少?
去掉注释和空白通常能让手写的样式表缩小 15–30%。配合 gzip 或 Brotli 压缩传输能节省更多,生产环境建议两者都用。
支持 @media、@supports 和嵌套规则吗?
支持。@ 规则和嵌套块会按层级缩进,其中的内容与普通规则一样被格式化,媒体查询依然便于浏览。
注释会保留吗?
格式化时保留块注释并让它们单独成行;压缩时会删除注释,因为浏览器不需要它们。
格式化工具会检查 CSS 错误吗?
不会校验属性名和属性值。它只格式化收到的内容,所以 colr: red 这样的拼写错误会原样保留;请用编辑器或 Stylelint 等检查工具来发现错误。
相关工具
JavaScript 格式化
粘贴 JavaScript 代码(包括压缩过的代码),即可得到整洁、带缩进的版本。...
SQL 格式化
粘贴 SQL 查询,立即获得带缩进、关键字大写的整洁版本。...
XML 格式化
粘贴 XML 文档以正确缩进格式化,或压缩为单行。...
YAML ↔ JSON 互转
粘贴 YAML 或 JSON —— 工具会自动识别格式并转换为另一种。...
JSON 格式化
在左侧粘贴 JSON 后点击「格式化」即可美化排版,点击「压缩」可压缩为单行。出错时会给出错误所在的行号。...
HTML 格式化
在左侧粘贴杂乱或压缩的 HTML,右侧立即得到带有正确缩进的整洁版本。...
HTML 实体编码 / 解码
把 &、<、> 等特殊字符转换为 HTML 实体(&、<、>),或反向解码。...
JWT 解码器
粘贴 JWT 令牌即可查看头部、载荷和签名。时间戳会自动转换为可读日期。...