vs code保存html中文不乱码的关键是先以原始编码（如gbk）重新打开再用utf-8无bom保存，并确保meta charset标签位于head首行且无前置字符，同时清除缓存、验证file -i输出及响应头。
VS Code 保存 HTML 中文乱码的正确操作
不是“点了 UTF-8 就万事大吉”，关键在保存动作是否真正覆盖了原始编码字节。VS Code 右下角显示 UTF-8，只是编辑器当前“猜测”的解码方式，不代表文件磁盘内容已是 UTF-8。
常见错误：直接点 Save，结果文件仍为 GBK 字节，只是被强行按 UTF-8 渲染——浏览器一打开就变 ä¸æ–‡。
- 先按
Ctrl+Shift+P→ 输入Reopen with Encoding→ 选GBK或GB2312，看中文是否立刻正常；如果能，说明原始就是 GBK - 确认后，再按
Ctrl+Shift+P→Save with Encoding→ 严格选UTF-8（注意不是UTF-8 with BOM） - 保存完立刻用终端验证：
file -i yourfile.html输出必须含charset=utf-8，否则没生效
为什么不能选 “UTF-8 with BOM”
BOM（EF BB BF）是三个隐藏字节，会干扰浏览器对 <meta charset="UTF-8"> 的识别。HTML 规范要求浏览器只扫描前 1024 字节找该标签，BOM 占了开头位置，可能导致 meta 被跳过，最终 fallback 到 Windows 默认的 GBK。
验证是否真去 BOM：head -c 3 yourfile.html | xxd，输出里绝不能出现 ef bb bf。
- Notepad++：菜单栏
编码 → 转为 UTF-8 无 BOM 格式 - VS Code：必须用
Save with Encoding → UTF-8，不能依赖右下角状态栏点“重新以 UTF-8 编码保存”（那个默认带 BOM） - Linux/macOS 下若已有 BOM，可用
sed -i '1s/^\xEF\xBB\xBF//' yourfile.html删除
meta charset 写对了，但还是乱码？检查它有没有被“挡住”
<meta charset="UTF-8"> 必须是 内第一个可解析标签。前面哪怕有一个空格、换行、HTML 注释 <!-- -->，都可能让浏览器放弃识别，直接退回到系统编码。
- 把它放在
开始后的**第一行**，前面不要有任何字符（包括空格和制表符） - 不要写成
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">—— 这是 HTML4 兼容写法，现代浏览器优先认charset属性，且更易受位置影响 - 用
head -c 1024 yourfile.html | grep -o "<meta>]*charset[^>]*>"确认它确实在前 1024 字节内被扫到
别忽略服务器或本地双击打开的差异
用 file:// 协议双击打开 HTML，浏览器**完全不看 HTTP 响应头**，只依赖 <meta charset>；但走 Nginx/Apache/Express 提供服务时，Content-Type 响应头优先级高于 meta 标签。
- 本地测试建议直接用 VS Code Live Server 插件启动，它会自动加
Content-Type: text/html; charset=utf-8响应头 - Nginx 配置中加
charset utf-8;（注意小写，且需在http、server或location块内） - Express 中用
res.sendFile()前务必加res.set('Content-Type', 'text/html; charset=utf-8')，否则默认不带 charset
最常被跳过的环节：改完文件编码和 meta 后，忘了清浏览器缓存，或者没重启本地服务——旧响应头还在生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
