lang属性必须写在标签上，因屏幕阅读器、chrome翻译按钮、搜索引擎和css :lang()仅识别此处声明；写在或中会导致等不继承语言信息，引发读音错误、无翻译按钮、样式失效及seo降权。
lang 属性必须写在 标签上，其他位置无效——这是唯一能让屏幕阅读器、Chrome 翻译按钮、搜索引擎和 CSS :lang() 正确识别页面语言的方式。
为什么不能写在 <div> 里<p>浏览器和辅助技术（如 NVDA、VoiceOver）在解析 HTML 最初几毫秒就读取 <code>，并据此加载中文语音库、切分音节、匹配词典。写在 <title></title> 和 <meta name="description"> 完全不继承它，导致这些关键语义信息“失语”：
- 屏幕阅读器把“行”读成 /hæŋ/ 而非 /ʃəŋ/
- Chrome 地址栏不出现翻译按钮，或点了直接翻成日语
-
:lang(zh-CN) { quotes: "“" "”"; } 样式完全不生效
- Google 可能将全中文页识别为“未标注语言”，影响搜索排名
lang 值怎么填才不被忽略
:lang(zh-CN) { quotes: "“" "”"; } 样式完全不生效lang 值怎么填才不被忽略必须严格符合 BCP 47 规范，大小写不敏感但惯例小写；非法值（如 zh_china、Chinese、zh）会被静默忽略：
- 中文优先用
zh-CN：覆盖拼音、声调、词典最全，NVDA/JAWS/VoiceOver 全部稳定支持 - 别用
zh-Hans：只表示“简体字”，不绑定地域，旧版 Edge 或某些翻译插件可能 fallback 到英文 TTS - 别用
zh：过于宽泛，iOS VoiceOver 可能直接用英文引擎处理多音字 - 英文必须用
en-US或en-GB，english、en_US（下划线非法）、EN-us（大小写错位）都无效
局部外语内容怎么加 lang
主语言靠 确立，嵌入的外语内容需显式标注子元素 lang，否则屏幕阅读器仍用中文规则硬读：
- 单个术语：
<span lang="en">API</span>→ 正确读作 /ˈeɪ.piː.ˈaɪ/ - 整段英文：
<p lang="en">This is a code example.</p> - 代码注释：
<pre class="brush:php;toolbar:false;" lang="en"># Initialize counter</pre>（注意不是lang="bash"） - 避免滥用：
<div lang="en"> 包裹多个段落会破坏语义层级，也干扰父级 <code>:lang(zh)的 CSS 匹配范围动态改
document.documentElement.lang有用吗基本没用。屏幕阅读器在 DOM 解析初期就缓存了
的初始lang值，后续 JS 修改不会触发语音引擎重载或文本重分析：- 单页应用（React/Vue）必须在服务端渲染（SSR）或静态生成阶段注入真实语言值
- Next.js 应在
app/layout.tsx中通过localeprop 注入，确保首屏 HTML 就含正确lang - 若真要做运行时切换（比如 demo 页），至少要同步触发
document.title = document.title，强制屏幕阅读器重新读取根节点
最容易被忽略的一点：字符编码和语言声明是两件事。
<meta charset="UTF-8">解决乱码，解决“谁来读、怎么读、往哪翻”。两者都得在里，且都得写对位置、写对值。
