CSS 格式化工具 在线免费版

Free 免费 · 无需注册 · 数据不上传
Indent
Error
CSS INPUT
OUTPUT
// formatted CSS output

更多开发工具

HTML 格式化
格式化美化
SQL 格式化
格式化 SQL
XML 格式化
格式化与验证
YAML 格式化
格式化与验证
正则表达式
实时测试
URL 编码
百分比编码
JSON 格式化
格式化、验证与压缩
HTML→Markdown
转 Markdown

为什么这是最好的在线 CSS 格式化工具

智能格式化

正确处理所有 CSS 结构:选择器、规则块、at-rules(@media@keyframes@supports)、注释以及带正确缩进的嵌套规则。

语法高亮

输出带有配色高亮:选择器、属性名、属性值、at-rules、注释、CSS 自定义属性和颜色字面量在视觉上各不相同,让格式化后的代码一目了然。

代码压缩

「压缩」按钮会移除 CSS 中的所有空白、注释和多余的分号——非常适合查看打包工具的输出效果,或快速压缩小段代码。

隐私优先

所有 CSS 格式化完全在你的浏览器中完成。不会向任何服务器发送内容。你的代码始终保持私密,工具也能离线使用。

常见问题

什么是 CSS 格式化工具?

CSS 格式化工具会把原始或压缩过的 CSS 重新排版,采用一致的缩进、间距和换行以提升可读性。它不会改变样式的应用方式——只改变面向开发者的视觉结构。

格式化 CSS 会改变它在浏览器中的运行方式吗?

不会。无论 CSS 是压缩过的还是漂亮缩进的,浏览器解析方式都完全相同,改变的只是开发体验。格式化后的 CSS 更易于阅读、调试和维护。

支持 CSS 自定义属性(变量)吗?

支持。像 --primary-color: #00e5b8 这样的 CSS 自定义属性会被正确处理,并在输出中用独特的颜色高亮显示。

支持 @media、@keyframes 等 at-rules 吗?

支持。所有 at-rules 均已支持,包括 @media@keyframes@supports@import@font-face。嵌套规则会自动多缩进一级。

什么是 CSS 压缩?

CSS 压缩会移除所有多余的空白和注释以减小文件体积,从而提升页面加载速度。本工具的「压缩」按钮让你在部署前先预览压缩后的输出。

深度指南
开发者必备工具指南
正则、Cron、时间戳、URL 等
阅读指南