正确设置文件编码可避免HTML乱码问题。VSCode默认使用UTF-8,若文件为GBK等编码,需点击右下角编码标识,选择“通过编码重新打开”以正确显示内容,再用“保存为编码”转为UTF-8。为减少手动操作,可在设置中将files.encoding设为utf8,并开启files.autoGuessEncoding,使VSCode自动识别编码。编辑完成后,建议点击右下角编码选项,选择“保存为编码”并选用UTF-8,同时在HTML头部添加,确保浏览器正确解析,从而彻底避免乱码问题。

在使用 VSCode 编辑和运行 HTML 文件时,确保文件编码正确非常重要,尤其是中文内容容易因编码问题出现乱码。VSCode 默认使用 UTF-8 编码,但如果你的文件保存为其他编码(如 GBK、GB2312),就需要手动设置或转换编码。
查看与设置当前文件编码
你可以随时查看并修改当前打开的 HTML 文件的编码方式:
- 打开一个 HTML 文件后,在编辑器右下角看到类似“UTF-8”或“GBK”的编码标识。
- 点击该编码名称,会弹出菜单,提供“通过编码重新打开”和“保存为编码”两个选项。
- 选择“通过编码重新打开”,然后选“GBK”或其他所需编码,可正确显示原有内容。
- 若要统一用 UTF-8,可选择“保存为编码” → “UTF-8”,将文件转码保存。
设置默认文件编码为 UTF-8
为了避免每次都要手动调整,建议将 VSCode 的默认编码设为 UTF-8:
- 打开 VSCode 设置(快捷键 Ctrl + ,)。
- 搜索关键词 files.encoding。
- 将其设置为 utf8,这样新打开的文件会优先以 UTF-8 解码。
- 同时可设置 files.autoGuessEncoding 为 true,让 VSCode 尝试自动识别文件编码(对 GBK 文件有帮助)。
保存 HTML 文件时指定编码
当你编辑完成准备保存时,可以主动选择编码格式:
立即学习“前端免费学习笔记(深入)”;
- 点击右下角当前编码(如 UTF-8)。
- 选择“保存为编码”,再选“UTF-8”或“GBK”等。
- 推荐始终以 UTF-8 保存 HTML 文件,这是 Web 标准推荐的编码方式。
- 可在 HTML 文件头部添加 确保浏览器正确解析。
基本上就这些。只要保证文件保存为 UTF-8 并在 HTML 中声明 charset,就能避免绝大多数编码乱码问题。不复杂但容易忽略。











