lang属性必须加在<html>标签上，因为浏览器、搜索引擎和屏幕阅读器仅识别该位置声明的页面主语言；局部元素需显式标注lang且符合BCP 47标准（如zh-CN），否则导致翻译、朗读、索引等功能失效。
lang 属性该加在哪个标签上
必须加在 <html> 标签上，这是唯一有效声明整个页面默认语言的位置。加在 <body> 或某个 <div> 上不会影响页面级语言识别，屏幕阅读器、搜索引擎和浏览器翻译功能都只认 <html lang="...">。
常见错误是漏写或写在内层元素里，比如：<div lang="zh-CN"> 只对这个 <div> 里的文本起作用，不能替代根节点声明。
lang 值怎么写才合法
用 BCP 47 标准格式，最简形式是小写双字母语言码，比如 zh、en、ja；需要区分地区时加连字符和区域子标签，如 zh-CN、zh-TW、en-US、en-GB。
注意这些细节：
立即学习“前端免费学习笔记（深入）”；
-
zh-CN和zh-cn效果一样，但推荐全小写（HTML 规范允许大小混用，但小写更稳妥） - 不要写
zh-chs或zh-hans—— 这些不是主流浏览器或 AT（辅助技术）广泛支持的写法 - 避免冗余，比如
zh-CN-Hans不必要，zh-CN已隐含简体中文习惯 - 如果页面内容混合多种语言且无主次，仍应选一个最主导的语言设为
<html lang>，其余用局部lang覆盖
遇到多语言内容怎么办
当页面中某段文字明显属于另一种语言（比如英文术语、引用的法文诗句、代码中的 console.log()），必须用局部 lang 显式标注，否则屏幕阅读器可能用错语音引擎，拼读错误。
实操建议：
- 对整块外文内容包裹
<span lang="en">API</span>或<blockquote lang="fr">…</blockquote> - 避免给单个单词乱加
lang，除非它确实改变了语义或发音（比如英文缩写<abbr lang="en">HTTP</abbr>） - CSS 中可用
:lang(en)选择器做字体微调，但别依赖它解决可访问性问题——lang属性的核心价值在语义，不在样式
不声明 lang 或写错会有什么实际影响
表面上页面照样显示，但真实代价藏在背后：
- 屏幕阅读器可能用普通话念英文专有名词，把 “CSS” 读成 “see-es-es”，而不是 “C-S-S”
- Chrome 浏览器可能跳过自动翻译提示，或把中英混排页误判为“无需翻译”
- 某些 SEO 工具会降低页面语言可信度评分，影响多语言站点的地域索引
- WCAG 3.1.1 要求明确语言，缺失即属 A 级可访问性违规
最容易被忽略的是：服务端渲染或 CMS 模板里，lang 值硬编码成 zh-CN 却没随用户语言切换而更新——这时候声明反而成了误导。
