必须置于 开头、首个非空白非注释标签位置，因浏览器仅解析前1024字节内的该标签；若开头存在BOM、空格、注释或，则fallback至系统默认编码（如GBK/ISO-8859-1），导致中文乱码；文件实际编码、meta声明、HTTP响应头charset三者必须严格一致且为标准写法“UTF-8”。
meta charset 必须放在 head 开头，且前面不能有任何字符
浏览器解析 HTML 时，前 1024 字节内遇到 才会生效；一旦开头有 BOM、空格、注释或 <script></script>，就可能 fallback 到系统默认编码（Windows 常为 GBK，Linux/macOS 常为 ISO-8859-1），导致中文直接变乱码。
常见错误现象：
-
首页 失效 -
—— 注释占位，部分 WebView 直接忽略 -
—— PHP 输出内容提前污染开头
正确写法只有一种：
，且确保该行是 后第一个非空白、非注释的标签。
文件编码必须和 meta charset 值严格一致
不是魔法开关，它只是告诉浏览器“请用 UTF-8 解码这个文件”——如果文件实际存的是 GBK 编码，浏览器仍会拿 UTF-8 去解 GBK 字节，结果就是 。
验证与操作要点：
- VS Code：保存时选 Save with Encoding → UTF-8（不是 “UTF-8 with BOM”）
- Notepad++：编码菜单选 转为 UTF-8（不要勾选 BOM）
- 命令行验证：
xxd -l 3 index.html，输出ef bb bf表示含 BOM，应删除 - 检查源码是否真含中文：用
cat index.html | iconv -f gbk -t utf-8 2>/dev/null | head -n 1测试转换是否报错
HTTP 响应头中的 charset 优先级高于 meta
当服务端返回 Content-Type: text/html; charset=GBK 时，哪怕 HTML 里写了 ，Chrome/Firefox 也会按响应头强制用 GBK 解码——这是 RFC 7231 明确规定的优先级。
各环境修正方式：
- Nginx：在
server或location块中加charset utf-8;（小写，不能写charset=UTF-8） - Apache：.htaccess 中写
AddDefaultCharset UTF-8 - Express：在
res.send()前调用res.set('Content-Type', 'text/html; charset=UTF-8') - PHP：页面开头加
header('Content-Type: text/html; charset=UTF-8');
调试时打开 DevTools → Network → 点 HTML 请求 → Headers → Response Headers，确认 Content-Type 字段值为 text/html; charset=UTF-8。
charset 值必须写成 "UTF-8"，大小写和拼写都不能错
HTML5 规范只认可 "UTF-8"（U-T-F-8，带连字符，首字母大写）。写成 utf8、utf-8、UTF8 或 unicode 都属于非标准值，部分嵌入式 WebView（如旧版 Android WebView、IoT 设备浏览器）会直接忽略，退回到系统默认编码。
实操注意点：
- 不要用单引号：
是合法的，但某些模板引擎会意外截断 - 不要加空格：
中尾部空格会导致解析失败 - 不要自作聪明：
在 HTML5 中冗余，且不如简洁可靠
最简、最稳、最兼容的写法只有这一种：，且必须出现在 的绝对开头位置。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
