必须紧贴开头零干扰，前面不能有bom、空格、注释或任何标签；content值严格大小写敏感且仅认ie=edge等特定格式；http响应头优先级更高；国产双核浏览器需额外添加renderer meta兜底。
meta http-equiv="X-UA-Compatible"必须紧贴开头，零干扰
它不是“写在head里就行”，而是必须出现在标签之后的**第一个字符位置**。前面不能有任何东西：UTF-8 BOM、空格、换行、<!-- comment -->、<title></title>，甚至另一个</meta>都不行。
常见失效场景：
- PHP模板用
file_get_contents()读取HTML后直接echo，可能带BOM - VS Code默认保存为“UTF-8 with BOM”，需手动改为“UTF-8”
- Webpack或Vite插件在HTML中注入调试脚本或注释，插在了
<meta http-equiv="X-UA-Compatible">之前
推荐写法：<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>页面标题</title>——中间不能有换行或空格。
content值大小写敏感且格式严格，只认特定字符串
IE=edge有效，ie=edge、IE = edge、IE=Edge全部无效。IE解析这个字段极脆弱，稍有偏差就退回到默认文档模式（通常是IE5 Quirks）。
合法取值仅限以下几种（全部大写IE=前缀 + 小写/驼峰后缀）：
-
IE=edge（请求当前IE最高可用文档模式） -
IE=7、IE=8、IE=10、IE=EmulateIE11 -
chrome=1已彻底失效——Google Chrome Frame自2014年起停更，现代IE/Edge完全忽略
多值写法如IE=edge,chrome=1虽曾被部分旧版支持，但W3C不认可，且会触发HTML验证失败，不建议使用。
HTTP响应头优先级永远高于meta标签
服务器通过响应头发送X-UA-Compatible: IE=5，哪怕HTML里写了content="IE=edge"，IE也会按header执行——meta被静默覆盖。
服务端配置更可靠，因为：
- 在HTML解析前就送达，不受BOM、顺序、JS篡改影响
- 避免前端模板引擎意外插入内容破坏meta位置
- 便于统一管控，无需逐页检查HTML源码
典型配置：
- Nginx：
add_header X-UA-Compatible "IE=edge";（放在server或location块内） - Express：
res.setHeader('X-UA-Compatible', 'IE=edge');（必须在res.send()之前调用） - IIS：
<httpprotocol><customheaders><add name="X-UA-Compatible" value="IE=edge"></add></customheaders></httpprotocol>
国产双核浏览器需要renderer meta兜底
360、QQ、搜狗等浏览器即使识别meta http-equiv="X-UA-Compatible"，也常无视它。必须额外加<meta name="renderer">声明渲染内核。
常用值：
-
<meta name="renderer" content="webkit">（强制WebKit内核） -
<meta name="renderer" content="ie-stand">（IE标准模式） -
<meta name="renderer" content="ie-comp">（IE兼容模式）
注意：renderer meta没有标准规范，不同厂商实现差异大，且不被Chrome/Firefox识别——它纯属国产浏览器特供补丁，别指望它跨平台生效。
真正起效的关键不在“写了没”，而在“运行时是否被浏览器真正采纳”。打开DevTools → Network → 找HTML请求 → 看Response Headers里有没有X-UA-Compatible字段；再进IE11或Edge的IE模式 → F12 →「仿真」→ 看「文档模式」显示的数字。这两个地方缺一不可，漏一个就等于没配。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
