可直接用:lang()伪类为不同语言内容应用专属样式，语义清晰、维护简单；需在HTML根元素声明lang属性，CSS中用:lang(zh-CN)等匹配，支持子语言继承、组合选择器及现代浏览器兼容。

可以直接用 :lang() 伪类选择器来为不同语言的页面内容应用专属样式，无需额外 class 或 JS 判断，语义清晰、维护简单。

基础用法：匹配 html 或 body 的 lang 属性

确保 HTML 根元素正确声明语言，例如：

``

或

``

然后在 CSS 中写：

立即学习“前端免费学习笔记（深入）”；

Aria2 Json Rpc

通过 JSON‑RPC 2.0 与 aria2 下载管理器交互，使用自然语言命令管理下载、查询状态并控制任务。适用于 aria2、下载管理或种子操作。

下载

`:lang(zh-CN) h1 { font-family: "PingFang SC", "Microsoft YaHei", sans-serif; }` `:lang(en-US) h1 { font-family: "Helvetica Neue", Arial, sans-serif; }`

浏览器会自动根据 lang 值匹配并生效对应规则。

支持多级语言范围匹配

:lang() 支持子语言继承匹配。比如设了 lang="zh-HK"，以下规则都会命中：

• :lang(zh)（匹配所有中文变体）
• :lang(zh-HK)（精确匹配）
• :lang(zh-CN) 不会命中（除非显式设置）

适合做「大语种统一 + 地区微调」的样式分层，例如：

`:lang(zh) .price::before { content: "¥"; }` `:lang(zh-HK) .price::before { content: "HK$"; }`

可与其他选择器组合使用

不局限于全局样式，能精准作用于局部语言内容。常见场景：

• 双语段落中仅对英文部分调整行高：p:lang(en) { line-height: 1.6; }
• 多语言导航菜单，按语言切换图标颜色：nav a:lang(ja) { color: #c00; }
• 表格内某列含多语言数据，用 td:lang(ar) 处理右对齐和字体： `td:lang(ar) { text-align: right; font-family: "Tajawal", sans-serif; }`

注意兼容性与 fallback 策略

现代浏览器（Chrome 1+、Firefox 1.5+、Safari 3.1+、Edge 12+）均支持 :lang()，IE8+ 也支持基本用法。但需注意：

• 必须真实设置 lang 属性，不能只靠 meta 或 HTTP header
• 服务端渲染或静态页建议直接输出正确 lang；SPA 可用 JS 动态切换 document.documentElement.lang
• 若需兼容极旧环境，可用 class 作为降级方案，如 html.lang-zh + html.lang-zh h1