根本原因是记事本默认用ANSI或UTF-8 with BOM保存,而浏览器解析时BOM(EF BB BF)会导致误判;HTML5要求meta charset声明必须与实际编码严格一致,否则浏览器猜错即乱码。

记事本保存 HTM 文件为什么一打开就是乱码?
根本原因不是“没写对 HTML”,而是记事本默认用 ANSI 或 UTF-8 with BOM 编码保存,而浏览器解析 HTM 时遇到 BOM 头(EF BB BF)会直接跳过或误判,导致中文显示为方块、问号或整页空白。
关键点:HTML5 规范要求 meta charset 声明必须与文件实际编码严格一致。你写了 <meta charset="UTF-8">,但文件其实是 ANSI 编码,浏览器就只能猜——猜错就是乱码。
- 记事本“另存为”时,“编码”下拉菜单里必须手动选
UTF-8(不是UTF-8 with BOM) - 文件扩展名必须是
.htm或.html,不能是.txt(即使内容是 HTML) - 如果已乱码,不要在记事本里直接改文字——先用其他编辑器(如 VS Code)以正确编码重新打开再编辑
VS Code 打开 HTM 文件显示乱码怎么办?
VS Code 默认会根据文件内容或 BOM 推断编码,但 Word 导出的 .htm 文件常带 GBK 编码且无声明,或含隐藏 BOM,VS Code 就容易误判为 UTF-8。
解决步骤:
- 右下角状态栏点击当前编码(如
UTF-8),选Reopen with Encoding→ 尝试GBK、GB2312、ISO-8859-1 - 确认能正常显示后,再点右下角编码 →
Save with Encoding→ 选UTF-8 - 保存前务必检查文件开头是否有
<meta charset="UTF-8">(放在内,且位置靠前) - 若原文件来自 Word,可能含大量
class="MsoToc1"等私有样式,这些不影响编码,但建议后续清理
Word 另存为 HTM 后怎么安全转成 UTF-8?
Word 导出的 .htm 默认用系统本地编码(Windows 中多为 GBK),且常在 <meta> 标签里写 gb2312 或干脆不写,直接改成 UTF-8 会导致页面崩溃——因为文件字节本身没变。
必须分两步走:
- 用 Notepad++ 或 VS Code 打开该文件 →
Encoding菜单中选Character sets → Chinese → GBK(或GB2312)→ 正常显示后,再执行“另存为” → 编码选UTF-8 - 手动把
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">改成<meta charset="UTF-8"> - 删掉 Word 插入的冗余
<style></style>块(如含MsoNormal的规则),避免干扰现代 CSS 渲染 - 注意 Word 生成的图片路径是相对的,保存为 UTF-8 后别移动文件夹结构,否则图片 404
批量处理一堆乱码 HTM 文件,命令行能干吗?
不能直接用 iconv 或 PowerShell 一键转——因为不知道原始编码是什么。盲目转换只会让乱码更乱。
可靠做法是先识别再转:
- 用
file -i *.htm(Linux/macOS)或 PowerShell 的Get-Content -Encoding Byte查看文件头几个字节,判断是否含 BOM 或疑似GBK字节模式 - 对确认是
GBK的文件,用iconv -f GBK -t UTF-8 input.htm -o output.htm - Windows 下推荐用 Notepad++ 批量:拖入所有文件 →
Encoding → Character sets → Chinese → GBK→ 全选标签页 →File → Save All→ 弹窗中统一选UTF-8 - 转完立刻用浏览器打开验证,重点看中文标题、段落、表格内容是否完整——别只信编辑器预览
BOM 是最隐蔽的坑:它看不见、删不掉、还影响所有现代浏览器对 HTM 文件的解析起点。每次保存前,盯住编辑器右下角那个编码标识,亲手点一次 UTF-8,比写十行 HTML 都管用。

















