已更新9月 2026
如何使用CSS美化器
- 粘贴 CSS - 缩小的制作样式或任何混乱的样式表。
- 读取格式化输出 - 每行一个声明，缩进的块。
- 查找和编辑您想要的内容 - 选择器和属性现在可搜索和扫描。
- 重新缩小以用于制作 - 美化编辑表格，而不是运输表格。
CSS美化器是什么？
CSS 美化器将压缩的样式表扩展为规范的可读形式：每个选择器的块位于其自己的行上，每行一个声明，一致的大括号和间距。缩小的 CSS - .card{margin:0 auto;padding:16px}.card h2{color:#333} - 成为可扫描的规则列表，查找和编辑属性只需几秒钟。
生产 CSS 已缩小，因此对实时网站真实样式的任何检查都从这里开始。生成的 CSS（来自构建器、导出器或预处理器输出）同样不可读 - 美化是理解或挽救它之前的标准第一步。
关于CSS美化器
粘贴缩小或混乱的CSS并获得格式化输出 - 规则分开，声明排列，嵌套（媒体查询，支持块）缩进。
人们美化的内容：生产站点的样式表以了解如何构建效果（查看源代码→复制→美化→搜索类名），自定义之前的主题或插件CSS，在团队制定格式化标准之前编写的旧项目样式，以及由从未听说过的工具组装的电子邮件模板CSS
直接编辑缩小的 CSS 是一种典型的错误经济——文本墙上漏掉的大括号会无形中破坏后面的每条规则。美化、以可见结构进行编辑，然后再次缩小以进行运输（CSS 缩小器无损地反转往返，减去缩小器已删除的注释）。
常见问题解答
否 — 仅空白和行结构发生变化；每个选择器、属性和值在含义上都以字节相同的方式存在。渲染不受影响。
规则是，评论不是——缩小将它们永久删除。美化的输出结构忠实但无注释；原始源文件仍然是唯一完整的记录。
更好地通过 DevTools（检查元素 - 它命名匹配规则），然后美化样式表以在上下文中读取这些规则。这两个工作流程相辅相成。
社区标准：选择器 + 左大括号在一行上，每个声明在自己的行上缩进，左大括号左对齐，规则之间有空行 - 形状 linter 就像 Stylelint 所期望的那样。
是的 - @media、@supports 和关键帧块将其包含的规则缩进一层，使查询结构与其内部的规则一样可见。