开发者工具

CSS 代码格式化工具

在线格式化、美化或压缩 CSS 代码。支持自定义缩进空格数量与排版模式,快速整理凌乱样式表。

运行工具

CSS 代码格式化工具用于规范和美化样式表代码,帮助开发者统一代码排版风格。该工具支持两种排版处理方式:在美化排版下,会按照指定的缩进空格数重新整理代码块并添加换行,使属性和选择器结构清晰易读;在压缩排版下,会移除块级注释、收缩冗余空白并剔除花括号、分号与冒号周围的多余空格,减小代码体积。

在参数设置方面,缩进量支持设置为 0 到 8 之间的整数,未指定或超出范围时会自动采用默认的 2 个空格缩进。待格式化的文本大小上限为 1,000,000 字节 UTF-8 编码内容。如果输入内容为空或仅包含空白字符,工具会直接返回空文本而无需经过体积校验与额外处理。工具专注于文本结构的排版调整,不作为语法校验器使用。

使用说明

  1. 在 CSS 输入框中粘贴或输入需要处理的样式表文本。
  2. 根据排版偏好选择处理模式,例如选择美化排版或压缩排版。
  3. 如果选择美化排版,可根据需求输入 0 至 8 之间的缩进空格数(默认使用 2 个空格)。
  4. 点击运行按钮,在结果展示区域查看格式化后的 CSS 样式内容。

示例

  • 美化单行样式:输入 body{margin:0;padding:0;background-color:#fff;} 并设置缩进为 2,美化后将拆分为多行显示,选择器花括号内部的每个属性前均带有 2 个空格缩进。
  • 压缩多行样式:输入包含多行缩进与注释的样式表并选择压缩排版,将移除块级注释和属性之间的多余换行空格,合并为紧凑的单行样式。

常见问题

缩进数值可以设置为多少?

缩进空格数支持设置为 0 到 8 之间的整数。如果输入的数值无法转换或者不在 0 至 8 的范围内,处理时会自动采用默认的 2 个空格。

压缩排版会做哪些具体处理?

在压缩排版下,工具会自动移除块级注释,合并连续的空白字符,并清理花括号、分号及冒号周围的多余空格,从而精简代码体积。

输入内容有大小限制吗?

非空白字符的 CSS 输入内容最大支持 1,000,000 字节 UTF-8 编码文本。超出此大小限制将无法进行格式化处理。

该工具会校验 CSS 语法的正确性吗?

该工具专注于代码排版美化与空白压缩,不作为 CSS 语法验证器或标准规范检查器使用。

嵌入此工具

使用以下代码,将这个可直接使用的 SmartPlusLab 工具添加到您的网站。