如何在VSCode中实现<head>和<body>标签的自动缩进？

这个问题通常是HTML格式化规则未开启内部缩进、或者默认格式化器配置错误导致的，可通过以下步骤解决：

• 第一步：确认并配置默认HTML格式化器
  • 打开VSCode设置面板，搜索@id:editor.defaultFormatter，找到HTML文件对应的配置项
  • 下拉选择内置的HTML Language Features格式化器，若使用Prettier可选择esbenp.prettier-vscode（需提前安装对应插件）
  • 继续搜索html.format.indentInnerHtml，勾选该配置项，这是控制、内部内容自动缩进的核心开关
• 第二步：Prettier格式化器的额外适配
  如果选择Prettier作为HTML默认格式化器，需要额外调整规则：
  • 在项目根目录新建/打开.prettierrc配置文件
  • 新增配置"htmlWhitespaceSensitivity": "css"，还可根据个人习惯搭配"tabWidth": 2设置缩进宽度
  • 保存配置后重新触发shift+option+f即可生效
• 第三步：临时手动调整方案
  如果需要快速调整格式，可选中需要缩进的或全区块：
  • 按cmd+]（Mac）/ctrl+]（Windows）批量增加缩进
  • 按cmd+[（Mac）/ctrl+[（Windows）批量减少缩进
  • 全文件格式化失效时可先按cmd+a全选内容，再触发格式化快捷键

内容的提问来源于stack exchange，提问作者Qianying Huang