脚注需在语义化内联或块级元素（如、、、）上显式设置lang属性，而非结构容器或；多语言混排须按词/短语粒度标注BCP 47语言码，CSS推荐用属性选择器如small[lang^="en"]匹配。
脚注元素本身不支持lang属性，必须用语义化容器包裹
HTML里没有专门的<footnote></footnote>标签，所谓“脚注”通常是<aside></aside>、<footer></footer>或<section></section>里的内容。这些容器本身不带语言语义，直接写<footer lang="en"></footer>只能影响其子元素的局部断词，**不会改变脚注文本的实际发音规则**——屏幕阅读器仍按主语言硬读英文术语。
真正起效的方式是：把脚注文本放进有明确语义的内联或块级元素，并在该元素上显式加lang。常见组合如下：
-
<aside></aside>作为脚注容器时，内部用<p lang="en"></p>或<small lang="fr"></small>包裹具体文字 - 若脚注含引文，优先用
<blockquote lang="ja"></blockquote>——语义清晰，读屏软件会主动切换日语TTS引擎 - 单个外文词（如
et al.）应包裹在<span lang="la"></span>中，避免整段被中文规则切音节 - 不要用
<div lang="en">套脚注——<code><div>无语义，多数读屏软件忽略其<code>lang为什么
footer或aside加lang基本无效浏览器和NVDA/VoiceOver等辅助工具只对具有**文本承载能力且语义明确**的元素（如
<p></p>、<blockquote></blockquote>、<th>、<code><td>）的<code>lang值做发音引擎切换。而<footer></footer>和<aside></aside>属于结构型容器，W3C规范未赋予其语言上下文传递能力。实测现象：
立即学习“前端免费学习笔记（深入）”；
-
<footer lang="en"><p>Source: W3C</p></footer>→ 读屏仍用中文引擎读“Source”，因为<p></p>没声明lang，父级lang不继承 -
<aside lang="fr"><small>Voir aussi</small></aside>→ “Voir aussi”仍被读成中文拼音，因<small></small>自身无lang - 正确写法：
<aside><small lang="fr">Voir aussi</small></aside>✅
脚注里混排多语言时的避坑要点
学术类脚注常含拉丁文缩写、德文文献名、日文汉字词，这时不能图省事全设一个
lang，否则“et al.”会被读成“伊特 阿尔”，“東京”被读成“dong jing”。必须按词/短语粒度拆分：- 拉丁文固定缩写（
cf.、ibid.、et al.）统一用lang="la" - 德文、法文、日文等完整词组，用对应BCP 47码：
lang="de"、lang="fr"、lang="ja"（无需-JP后缀，除非需区分海外日语） - 中文脚注说明文字保留父级
默认行为，不额外加lang - 避免嵌套过深：
<sup><a href="#fn1"><span lang="en">1</span></a></sup>中，数字“1”是阿拉伯数字，无自然语言，lang冗余
CSS
:lang()在脚注中怎么写才匹配成功脚注样式常需为不同语言指定字体或间距，但
small:lang(en) { font-family: "Helvetica Neue"; }容易失效。原因很实在：-
:lang(en)是**精确字符串匹配**，<small lang="en-US"></small>不会被:lang(en)捕获 - 脚注里若用
<em></em>强调某词，而lang只写在<small></small>上，则em:lang(en)完全不触发——伪类不继承 - 更稳的写法是属性选择器：
small[lang^="en"]匹配所有以en开头的语言码（en、en-US、en-GB都生效） - 若脚注需统一处理所有非中文内容，可写
small :not([lang="zh-CN"]):not([lang="zh-Hans"])，但注意性能开销
最麻烦的不是设对一个
lang="en"，而是当脚注来自CMS字段或用户输入时，那段HTML片段是否真的带着正确的lang被插入到DOM里——动态渲染漏掉这层，读屏就永远读错。 -
