:lang() 伪类按 BCP 47 规则匹配语言标签，支持子标签继承（如 :lang(en) 匹配 en、en-US、en-GB-x-custom），不区分大小写，仅匹配显式设置或继承的合法 lang 属性值，不响应系统语言或未声明语言的元素。
css:lang() 伪类能匹配哪些语言值
:lang() 匹配的是元素的 lang 属性值（或其继承值），但不是简单字符串相等，而是按 BCP 47 语言标签规则做「语言范围匹配」。比如 :lang(en) 能同时匹配
、
、
- 必须有有效的
lang属性（显式设置或从父级继承） - 不区分大小写，
lang="ZH"和lang="zh"效果一致 - 支持子标签匹配：
:lang(zh-Hans)匹配zh-Hans、zh-Hans-CN，但不匹配zh-Hant - 无法匹配未声明语言的元素，即使浏览器 locale 是中文，
文本
:lang(zh)选中
为什么 :lang(en) 没生效？常见失效原因
最常踩的坑是误以为 :lang() 会读取系统语言或 的 xml:lang（若没设 lang）：
-
标签没写lang属性 → 后代元素无语言继承源 - 写了
xml:lang但没写lang→ 大多数浏览器只认lang（HTML5 规范要求优先用lang） - 动态改
lang属性后样式没更新 → CSS 不监听属性变更，需手动触发重绘（如切换 class 或强制getComputedStyle） - 使用了非法语言标签，如
lang="chinese"或lang="cn"→ 不符合 BCP 47，浏览器视作无效，不参与匹配
配合 HTML lang 属性实现多语言样式切换
真实项目中，通常靠 JS 切换 ，再用 :lang() 控制全局样式：
立即学习“前端免费学习笔记（深入）”；
