CSS 格式化/压缩

格式化 CSS 代码使其更易读,或压缩 CSS 以减小体积

使用说明

  • 在左侧输入框中粘贴 CSS 代码
  • 点击「格式化」美化缩进和换行
  • 点击「压缩」去除空白和注释
  • 支持 CSS 注释的移除

功能特点

  • 智能缩进选择器和属性,支持嵌套规则(@media、@keyframes)
  • 保持属性顺序不变,支持自定义属性排序
  • 支持 CSS3 和 CSS4 最新语法特性
  • 压缩模式可移除注释和多余空白
  • 保留浏览器前缀(-webkit-、-moz- 等)

使用说明

将 CSS 代码粘贴到输入框,点击「格式化」即可美化样式表。支持选择器分组、属性排序、媒体查询嵌套等场景。压缩模式可以将 CSS 压缩为单行格式。

使用示例

CSS 格式化示例

/* 格式化前 */
body{margin:0;padding:0}.container{max-width:1200px}

/* 格式化后 */
body {
  margin: 0;
  padding: 0;
}
.container {
  max-width: 1200px;
}

常见问题

CSS 格式化会改变属性的功能吗?

不会。格式化仅调整缩进和换行,不修改任何属性值和选择器名称,保证功能完全不变。

支持 SCSS 或 Less 等预处理器吗?

目前主要支持标准 CSS。如果您使用 SCSS 或 Less,建议先编译为标准 CSS 后再进行格式化。

格式化后代码变长,会影响性能吗?

不影响。CSS 文件的执行性能不受格式化影响。如果担心文件大小,可以使用压缩模式生成精简版本。