必须将 lang 属性唯一设置在 <html> 标签上，如 <html lang="zh-CN">，以确保屏幕阅读器正确识别页面主语言；其他位置或写法均无效或不兼容。
必须写在 <html> 标签上，且只写一次；写错、写漏或写在其他地方，屏幕阅读器基本就“听不懂”你在说什么了。
lang 属性只能设在 <html> 标签上
浏览器和屏幕阅读器（如 NVDA、VoiceOver）只认根元素上的 lang 值。它决定了整页文本的默认发音规则、断词逻辑和标点朗读方式。
-
<html lang="zh-CN">✅ 正确：页面主语言明确为简体中文（中国大陆） -
<body lang="zh-CN">❌ 无效：不被解析为文档语言，仅影响该<body>内部的局部行为（如有） -
<meta http-equiv="Content-Language" content="zh-CN">❌ 已废弃：HTML5 不再支持，完全被忽略 -
<html lang="">或<html lang="zh">❌ 风险高：空值视为“未知语言”，zh过于宽泛，部分读屏软件会 fallback 到英文引擎
为什么选 zh-CN 而不是 zh-Hans 或 zh
BCP 47 规范允许多种写法，但实际兼容性差异很大。屏幕阅读器依赖语言码加载对应语音库，拼错或粒度太粗都会导致误读。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
zh-CN：事实标准，覆盖拼音方案、词典、声调规则最全，NVDA/JAWS/VoiceOver 全部稳定识别 -
zh-Hans：强调“简体字”，但未绑定地域，某些旧版读屏或翻译插件可能无法匹配正确语音模型 -
zh：不区分简繁、不指明区域，iOS VoiceOver 可能跳过中文 TTS 引擎直接用英语朗读“行”“长”等多音字 - 别写
zh_china、zh_CN、Chinese：全部非法，会被静默忽略
多语言混排时怎么让屏幕阅读器“切换语种”
主语言靠 <html lang="zh-CN"> 确立，但嵌入的英文术语、日文引用、代码注释等，必须显式标注子元素的 lang，否则读屏仍用中文规则硬读。
立即学习“前端免费学习笔记（深入）”；
- 单个外文词：
<span lang="en">API</span>→ 读作 /ˈeɪ.piː.ˈaɪ/，不是“阿皮” - 整段英文：
<p lang="en">This is a code example.</p> - 代码块注释：
<pre lang="en"># Initialize counter</pre>（注意不是lang="bash"） - 避免滥用：
<div lang="en">包裹多个段落——语义不清，且可能干扰父级:lang(zh)CSS 匹配
JS 动态改 lang 对屏幕阅读器基本没用
屏幕阅读器在 DOM 解析初期就读取 <html> 的 lang，后续 JS 修改（如 document.documentElement.lang = "en-US"）不会触发语音引擎重载或重新分析文本。
- SPA 多语言切换：不能只靠 JS patch，必须服务端渲染（SSR）或静态生成（SSG）不同
lang的 HTML 文件 - Next.js/Nuxt：确保
<html lang={locale}>在首屏 HTML 中已存在，而不是等客户端 hydration 后才注入 - 强制刷新是目前最可靠方案：语言切换后
window.location.href = "/en/about"，让读屏从头开始读 - 哪怕你把
lang改对了，已朗读过的节点也不会自动重读——这是最容易被忽略的“假成功”场景
