Prettier 是格式化 CSS 最推荐的插件，支持多语言、自动保存格式化及自定义配置，结合 Stylelint 可提升代码质量，适合团队开发。
VSCode 中格式化 CSS 代码不需要依赖第三方插件也能完成，因为 VSCode 内置了基础的 CSS 格式化功能。但为了获得更强大、更智能的格式化体验，推荐使用以下几款实用插件来提升开发效率。
Prettier - Code Formatter
这是目前最流行的代码格式化工具之一，支持 CSS、SCSS、Less、JavaScript、HTML 等多种语言。
优点：- 统一团队代码风格
- 支持自动保存时格式化
- 可自定义配置（通过 .prettierrc 文件）
- 与 ESLint 配合良好
- 打开 VSCode 扩展商店（快捷键 Ctrl+Shift+X）
- 搜索 "Prettier - Code Formatter"（作者：Prettier）
- 点击“Install”安装
- 安装后右键编辑器任意位置，选择“Format Document With...”，然后设为默认格式化工具
Beautify
虽然 Prettier 更现代，但 Beautify 仍是不少老项目开发者的选择，特别适合需要格式化旧式 CSS 或嵌入式样式的情况。
功能特点：- 支持 CSS、JS、HTML、JSON 格式化
- 可通过 settings.json 自定义缩进、换行等规则
- 轻量易用
Stylelint
这是一款 CSS 语法检查工具，配合格式化插件使用效果更佳，可以避免错误写法并自动修复部分问题。
立即学习“前端免费学习笔记（深入）”；
搭配建议：- 安装 “stylelint” 和 VSCode 插件 “stylelint.vscode-stylelint”
- 在项目中添加 .stylelintrc 配置文件
- 启用 “auto-fix on save” 实现边写边修正
如何设置保存时自动格式化 CSS？
无论使用 Prettier 还是其他工具，都可以开启保存自动格式化功能。
- 打开 VSCode 设置（Ctrl+,）
- 搜索 “format on save”
- 勾选 “Editor: Format On Save”
- 确保已设置默认格式化工具为 Prettier 或你选择的插件
基本上就这些。Prettier 是当前格式化 CSS 最推荐的插件，结合 Stylelint 可实现高质量代码输出。安装简单，配置灵活，适合个人和团队使用。
