:lang选择器可根据HTML的lang属性为不同语言文本自动应用样式，如中文红色、英文蓝色，支持伪元素和继承，需确保lang属性正确书写，适用于多语言混排场景。
在多语言网页中，不同语言的文字可能需要不同的样式处理，比如字体、颜色或行高。CSS 的 :lang 选择器可以基于元素的语言属性自动应用特定样式，无需额外类名，特别适合处理混合语言内容。
使用 :lang 选择器识别语言
HTML 中通过 lang 属性定义文本语言，例如 <p lang="zh">中文</p> 或 <span lang="en">English</span>。CSS 的 :lang() 可以匹配这些语言并设置对应样式。
/* 为中文文本设置红色 */
:lang(zh) {
color: red;
}
/ 为英文文本设置蓝色 /
:lang(en) {
color: blue;
}
/ 法语绿色 /
:lang(fr) {
color: green;
}
实际应用场景示例
当页面同时显示多种语言时，比如用户评论包含中文和英文，使用 :lang 能让浏览器自动区分并着色，提升可读性。
立即学习“前端免费学习笔记（深入）”；
- 中文内容用深红突出，便于识别母语段落
- 英文部分设为蓝色，与界面主色调区分开
- 特殊语言如阿拉伯语（ar）可配合文字方向调整样式
它也适用于伪元素，比如给不同语言的引用添加语言特定的引号样式：
:lang(zh)::before {
content: "“";
}
:lang(en)::before {
content: "\"";
}
注意事项与兼容性
:lang 依赖 HTML 的 lang 属性正确书写。如果缺失或拼写错误（如 "zn" 代替 "zh"），样式将不生效。
- 推荐在根元素 html 上设置默认语言：<html lang="zh-CN">
- 支持继承，子元素未指定 lang 时会沿用父级
- 主流现代浏览器都支持，包括 IE8+（需文档声明）
基本上就这些。只要结构清晰，:lang 是实现多语言样式自动化的简洁方式，尤其适合内容动态、语言混排的场景。
