lang属性必须严格遵循bcp 47标准（如zh-cn、ja-jp），写错或漏设会导致浏览器跳过中文字体链而启用西文fallback，引发标点异常、混排错乱或方块字；需在具体元素显式声明，字体链须将语言专用字体置首、sans-serif置尾，并配合font-display:swap确保回退生效。
lang属性必须用BCP 47标准代码，不是随便写
浏览器、屏幕阅读器、SEO爬虫只认标准语言子标签，zh-CN、pt-BR、en-GB 是合法的；zh_CN、chinese、english 这类会被忽略甚至触发 fallback 行为。
IANA语言子标签注册表是唯一权威来源，查不到的代码别硬造。比如简体中文优先用 zh-Hans（更通用），而不是 zh-CN（带地域限制）；繁体中文用 zh-Hant，而非 zh-TW（除非明确限定台湾地区）。
- 常见错误：在
里只写主语种，漏掉变体，导致字体回退异常、标点间距错乱 - 多语言混排时，
<p lang="ja">こんにちは</p>和<span lang="ko">안녕하세요</span>必须各自声明，不能靠父级继承 -
lang值区分大小写，EN-US和en-US效果不同——实际应全小写，连字符分隔
局部语言变体要显式标记，不能靠JS动态改根节点
只执行 document.documentElement.lang = "fr" 不会改变已渲染的 <blockquote lang="de"></blockquote> 或 <pre class="brush:php;toolbar:false;" lang="bash"></pre> 的行为。浏览器和辅助技术按每个元素自己的 lang 属性判断发音、拼写检查、翻译范围。
SPA切换语言时，必须同步更新三类节点：document.documentElement、所有显式带 lang 的元素（如引用、代码块、术语）、以及所有 data-i18n 绑定的文本节点。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 错误做法：用 CSS
[lang="en"] .nav { display: block; }控制显示，结果 SEO 抓不到非默认语言内容 - 正确做法：每个语言区块独立声明
lang，例如一段法语引文套在<aside lang="fr"></aside>里，而非仅靠根节点 -
<pre class="brush:php;toolbar:false;" lang="bash"></pre>中的lang="bash"不是标准语言码，但被语法高亮工具和部分 IDE 识别，不影响浏览器解析——这不是 bug，是约定俗成的用法
dir + lang 组合处理 RTL 语言，但别用CSS direction替代
dir="rtl" 是 HTML 原生方向控制属性，必须配合 lang 使用，比如 。仅用 CSS direction: rtl 会让浏览器和翻译服务“看不见”方向意图，导致 AI 翻译模型上下文错乱。
方向属性可被继承，但嵌套 LTR 内容（如阿拉伯文中夹英文 URL）需显式重置：<span lang="en" dir="ltr">https://example.com</span>。
- 常见坑：给
加dir="rtl"，但没在上设lang，屏幕阅读器仍按默认语言朗读 -
dir在 HTML5 中可用于任意元素，但在 HTML 4.01 中不支持<input>、<textarea></textarea>等表单控件 - 不要用
style="direction: rtl"替代dir属性——样式层生效，语义层丢失
title 和属性值里的多语言文本无法拆分标记
<title></title> 元素和所有属性值（alt、placeholder、aria-label）都不允许嵌套标签，所以一段含中英混合的 <title>API 文档 — API Documentation</title> 没法分别声明语言。浏览器只能按根 lang 解析整段。
目前没有 W3C 标准方案解决这个问题。临时对策是：优先保证主语言完整，次要语言尽量用 ASCII 字符或统一转写（如 “API Documentation” → “API 文档”），避免混排。
- 不可行方案：试图在
title里插<span lang="en"></span>—— 浏览器直接忽略，且可能截断标题 - 可行折中：用
data-i18n-title配合 JS 动态写入document.title，但需确保 SSR 或预渲染时 fallback 到合理默认值 - 属性值多语言问题同样存在于
aria-label，若必须混用，建议只保留一种语言，或用空格+括号隔离（如aria-label="搜索（Search）"），依赖屏幕阅读器按主语言读出
lang 的子元素——它们不会随根节点变更自动刷新，而多数 JS 国际化库默认只管文本内容，不管语义属性。一旦漏掉，字体回退、语音朗读、AI 翻译都会出偏差。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
