lang属性必须写在<html>标签上才生效，浏览器、屏幕阅读器、搜索引擎和Chrome翻译仅识别该位置的值；错误写法如<body lang="zh-CN">、<html lang="Chinese">或<html lang="zh_ch">均无效，正确格式须符合BCP 47规范，如zh-CN、en-US。
lang必须写在标签上才生效
浏览器、屏幕阅读器、搜索引擎和Chrome翻译功能，全部只认html元素上的lang属性——写在body、div甚至title里，等于没写。常见错误包括：<body lang="zh-CN">（整页语言声明失效）、<html lang="Chinese">（非法值被忽略）、<html lang="zh_ch">（下划线不合法，BCP 47要求连字符）。
实操建议：
- 静态页直接硬编码：
<html lang="zh-CN">或<html lang="en-US"> - SSR场景下，务必根据请求头
Accept-Language动态生成该值，不能等JS执行后再补 - Vue/React项目中，检查
index.html里的lang是否随i18n状态同步更新，否则首屏就错 - 改完后立刻触发
document.title = document.title，强制屏幕阅读器重读根节点语言
值必须符合BCP 47规范，大小写和分隔符都不能错
zh-CN有效，ZH-CN、zh_cn、zh都不可靠。iOS VoiceOver对zh可能fallback到英文TTS；旧版Edge对zh-Hans支持不全；en-us虽不报错但易引发模板不一致，统一用小写+短横线最稳。
关键规则：
立即学习“前端免费学习笔记（深入）”；
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 语言子标签小写：
fr、ja、pt - 地区子标签大写：
FR、JP、BR - 组合用短横线：
fr-FR、pt-BR、zh-TW，不能用下划线或空格 - 品牌名/代码片段等短内容，建议显式加
lang="en"，哪怕页面是中文
局部语言切换要用子元素lang覆盖，不能依赖继承或猜测
浏览器不会自动识别「这是法语引文」「这是Shell命令」。不加lang，整段就按html的默认语言处理：中文页里<p>curl -X POST</p>会被VoiceOver用中文音节硬读，拼写检查标红，字体fallback也可能错乱（比如把ls塞进中文字体里显示为方块）。
正确做法：
- 外文段落：
<p lang="fr">Merci beaucoup.</p> - 代码块：
<pre lang="bash">npm install</pre>或<code lang="en">useState</code> - 双语表格每行标注：
<tr><td lang="zh-CN">用户</td><td lang="en-US">User</td></tr> - 避免滥用：
span或div仅作样式用途时，别加lang，干扰可访问性树构建
lang和translate、dir、hreflang不是一回事，混用会出问题
lang回答“这是什么语言”，translate="no"回答“要不要被浏览器翻译”。两者行为独立：translate="no"能抑制Chrome右键翻译提示，但Safari不支持、Firefox行为不一致；它完全不影响屏幕阅读器——后者只看lang。
常见误配：
- 给阿拉伯语页面只设
lang="ar"却不加dir="rtl"：光标位置、Tab顺序、inputplaceholder渲染全错 - 在
link标签里写hreflang="zh-CN"，以为能替代html lang：这是用于多语言站点版本发现的，和页面内语言声明无关 - 第三方组件（如评论插件）插入DOM时自带
lang="en"，覆盖了父级设置：需检查并手动重置
真正容易被忽略的是动态插入内容：通过innerHTML或框架render生成的新节点，如果没同步设置lang，它们就处于无语言上下文状态——拼写检查、CSS :lang(zh)匹配、hyphens断字全部失效。
