sublime怎么格式化html_sublime HTML代码美化方法

使用HTML-CSS-JS Prettify插件可实现Sublime Text的HTML格式化：1. 安装Package Control；2. 通过命令面板安装插件；3. 按Ctrl+Shift+H（或Cmd+Shift+H）格式化代码；4. 可选配置缩进、保存时自动格式化等；5. 替代插件有Jsformat或Pretty Diff，提升代码可读性。

Sublime Text 本身不带内置的 HTML 格式化功能，但可以通过安装插件来实现 HTML 代码的美化和格式化。最常用的方法是使用 HTML-CSS-JS Prettify 插件，它基于 Prettier，支持 HTML、CSS、JavaScript 等代码的自动排版。

1. 安装 Package Control（如果尚未安装）

大多数插件都通过 Package Control 来管理。按下 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（Mac），输入 "Install Package Control"，按照提示完成安装。

2. 安装 HTML-CSS-JS Prettify 插件

安装完 Package Control 后：

• 按下 Ctrl+Shift+P 打开命令面板
• 输入 “Package Control: Install Package”，回车
• 搜索 “HTML-CSS-JS Prettify”，点击安装

3. 使用插件格式化 HTML

安装完成后，打开一个 HTML 文件：

立即学习“前端免费学习笔记（深入）”；

• 按下 Ctrl+Shift+H（Windows/Linux）或 Cmd+Shift+H（Mac），即可格式化当前 HTML 代码
• 也可以右键编辑器，选择 “HTML/CSS/JS Prettify” → “Run Prettify”

4. 配置格式化选项（可选）

如果你想自定义缩进、引号样式等，可以配置插件设置：

比格设计

比格设计是135编辑器旗下一款一站式、多场景、智能化的在线图片编辑器

124

查看详情

• 进入菜单栏：Preferences → Package Settings → HTML-CSS-JS Prettify → Settings - User
• 添加如下配置示例（使用两个空格缩进）：

{ "format_on_save": false, "js_beautify": false, "html_attributes_indent": 2, "indent_size": 2, "wrap_line_length": 80 }

其中 format_on_save 设为 true 可在保存时自动格式化。

5. 替代方案：使用 JS-Beautify 或 Pretty Diff

如果你只需要基础格式化，也可以尝试其他插件：

• JsFormat：主要针对 JavaScript，但也支持部分 HTML
• Pretty Diff：支持多种语言对比与美化

基本上就这些。安装 Prettify 插件后，一键快捷键就能让 HTML 代码变得清晰整齐，提升可读性。注意确保文件语法已设置为 HTML，否则可能无法正常格式化。