lang属性必须写在标签上才有效，写在或子元素中无效；charset和lang缺一不可，且位置、格式、大小写均影响解析与渲染效果。
lang属性写错位置等于没写
浏览器、屏幕阅读器、Chrome 翻译都只认 标签上的 lang，写在 或任意子元素里，就和没声明一样。
常见错误现象：
-
→ 屏幕阅读器仍用系统默认语音读中文，发音错乱 -
<meta http-equiv="Content-Language" content="zh-CN">→ HTML5 已弃用，完全无效 -
或→ 值非法，被当作“未知语言”，比不写还糟
实操建议：
- SSR 页面：服务端根据
Accept-Language请求头或 URL 路径（如/ja/about）直接输出 - SPA 页面：语言切换时必须执行
document.documentElement.lang = "ko"，不能只改 state 或局部文案 - 静态页：每个语言版本单独一份 HTML，
标签硬编码，避免 JS 注入延迟导致闪动
charset 和 lang 共同决定文本能否被正确解码+解读
<meta charset="UTF-8"> 解决“字节怎么转成字符”，lang 解决“这个字符该按哪种语言规则处理”。两者缺一不可，且顺序和位置都影响行为。
立即学习“前端免费学习笔记（深入）”；
容易踩的坑：
-
<meta charset="UTF-8">没放在最前面 → 浏览器可能先用 ISO-8859-1 解析前几个字节，导致开头乱码（如æ–‡） - HTTP 响应头没带
Content-Type: text/html; charset=utf-8，又没写<meta charset>→ 在file://协议或某些 Nginx 配置下，直接 fallback 到 Latin-1，中文全变 - 写了
UTF-8但lang="zh"→ 某些 TTS 引擎（如 macOS VoiceOver）会降级到粤语发音，而lang="zh-CN"才锁定普通话
关键点：HTTP 头的 charset 优先级高于 <meta charset>，但若 HTTP 头缺失，浏览器才 fallback 到 meta；lang 则完全不看 HTTP 头，只依赖 HTML 结构。
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
多语言混排时 lang 不覆盖，字体渲染和断字就失效
中文页面里嵌一段日文引文，只靠浏览器自动识别？不行。不显式加 lang="ja"，hyphens: auto 不生效，Noto Sans CJK 也不会触发日文 OpenType 特性（比如长音符间距），标点挤压也错乱。
使用场景与参数差异：
-
<p lang="zh-CN">点击「确定」继续</p>→ 中文顿号、引号正常挤压 -
<blockquote lang="ja">「はい」と答えました。</blockquote>→ 日文长音符「ー」和句点「。」获得正确字距 -
<code lang="en">useState→ IDE 插件可据此启用英文语法高亮，拼写检查也不误标
注意：lang 具有继承性，但继承 ≠ 自动推断。浏览器不会因为段落里出现「こんにちは」就认为它是日语——必须手动声明。
JS 动态插入内容时 lang 必须同步设置
用 innerHTML 或 appendChild 插入新节点后，只改文本不设 lang，屏幕阅读器不会重判语言，TTS 引擎可能静音或硬读出错音（比如把「行」读成 xíng 而非 háng）。
实操建议：
- 插入外文内容时，连同
lang一起创建节点：const el = document.createElement('p'); el.lang = 'fr'; el.textContent = 'Merci beaucoup.' - 用
document.createElementNS创建带命名空间的元素（如 SVG 内文本）时，lang仍需显式设置，SVG 元素不自动继承 HTML 的lang - Web Speech API 中调用
speechSynthesis.speak()前，检查SpeechSynthesisVoice.lang是否匹配当前文本的lang属性，否则可能抛DOMException: The speech synthesis failed to speak
最常被忽略的一点：CSS 的 hyphens: auto 和字体特性（如 font-language-override）是否生效，不取决于你写了什么样式，而取决于对应元素有没有合法、准确、位置正确的 lang 值。
