meta charset="UTF-8" 必须是<head>的第一个子节点，且HTML文件必须为UTF-8无BOM编码，HTTP响应头Content-Type也需含charset=utf-8，三者缺一不可，否则中文大概率乱码。
直接说结论：meta charset="UTF-8" 必须是 <head> 的第一个子节点，且 HTML 文件本身必须是 UTF-8 编码（无 BOM），HTTP 响应头中的 Content-Type 也得带 charset=utf-8 —— 三者缺一不可，否则中文大概率乱码。
为什么 meta charset="UTF-8" 放在 <head> 开头这么关键
浏览器解析 HTML 时，只扫描前 1024 字节来找 meta charset。一旦开头有 BOM（EF BB BF）、空行、注释（<!-- -->）、<script> 或甚至一个全角空格，它就会跳过这个 meta，fallback 到系统默认编码（Windows 是 GBK，Linux/macOS 常是 ISO-8859-1）。
-
<head>第一行不能有任何字符，包括不可见的 BOM 和空格 - VS Code 里看到 “UTF-8 with BOM” 就要警惕：点右下角编码 → “Reopen with Encoding” → 选
UTF-8（不是 with BOM），再点 “Save with Encoding” → 再选UTF-8 - Linux/macOS 下用
xxd -l 4 index.html检查开头：如果输出含ef bb bf，说明有 BOM，用sed -i '1s/^\xEF\xBB\xBF//' index.html删掉 - PowerShell 下用
Get-Content index.html -Encoding Byte | Select -First 3，若前三字节是239 187 191，就是 BOM
怎么确认 HTTP 响应头真生效了
本地双击打开（file:// 协议）时，HTTP 头完全无效，全靠 meta；但只要走 http:// 或 https://，响应头优先级就高于 meta。如果头里写的是 charset=gbk 或压根没 charset，meta 就会被无视。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- F12 打开 DevTools → Network → 刷新页面 → 点 HTML 请求 → Headers → Response Headers → 查
Content-Type值是否为text/html; charset=utf-8 - Nginx 配置里写
charset utf-8;（小写，分号不能少，别写成charset=UTF-8） - Apache 的
.htaccess或配置文件加AddDefaultCharset UTF-8（注意大小写） - Express.js 中，
res.sendFile()或res.send()前必须调用res.set('Content-Type', 'text/html; charset=utf-8')
编辑器保存设置和外部资源也得同步
就算 HTML 文件本身没问题，JS/CSS 文件如果用 GBK 保存，或者数据库返回内容没声明 UTF-8，照样会乱。而且某些模板引擎（如 Thymeleaf、EJS）会在 <head> 前注入注释或脚本，把 meta 挤到第二位。
立即学习“前端免费学习笔记（深入）”；
- VS Code / Sublime / Notepad++ 保存 HTML 时，务必选 “UTF-8”（Notepad++ 选 “UTF-8 without BOM”）
- 外部 JS/CSS 文件同样要检查编码，用
file -i your.js（Linux/macOS）或 PowerShell 的Get-Content -Encoding Byte验证 - 如果用了服务端模板，检查生成的最终 HTML 源码：F12 → Elements → 展开
<head>，确认<meta charset="UTF-8">确实是第一个子节点 - 别信
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">—— HTML5 已不推荐，且兼容性不如meta charset
最容易被忽略的其实是“三重一致性”：文件真实编码、meta 标签位置、HTTP 响应头 —— 它们不是“任选其一”，而是必须同时满足。尤其在调试时，常有人改了 HTML 却忘了配 Nginx，或删了 BOM 却没更新服务器缓存，结果反复折腾半天。
