:target 伪类用于高亮页面锚点目标，提升导航可视性；:lang() 根据元素语言设置差异化样式，增强多语言排版与可访问性，二者结合语义化结构优化用户体验。
在网页开发中，CSS 提供了许多伪类来帮助开发者更灵活地控制页面样式。其中 :target 和 :lang 是两个功能独特且实用的伪类，分别用于处理页面内锚点跳转和基于语言的样式设定。合理使用它们可以提升用户体验和内容可读性。
利用 :target 实现锚点高亮效果
当页面 URL 包含片段标识符（即 # 后的内容）时，浏览器会尝试滚动到对应 id 的元素。此时，该元素就成为“目标元素”，而 :target 伪类可以选中这个元素，从而为其添加特殊样式。
例如，点击一个指向 #section1 的链接时，id 为 section1 的元素会被选中，你可以通过以下 CSS 让其背景短暂突出：
:target {
background-color: #ffeb3b;
padding: 10px;
border-left: 4px solid #ff9800;
}
这种视觉反馈让用户清楚地知道当前查看的是哪一部分内容，特别适用于文档页、帮助中心或长文阅读场景。
立即学习“前端免费学习笔记（深入）”；
使用 :lang 设置不同语言的排版样式
网页可能包含多种语言文本，不同语言在排版上有各自的最佳实践。CSS 的 :lang() 伪类可以根据元素的语言属性自动应用对应的样式规则，无需额外类名。
比如中文常使用全角标点和特定字体，而英文则适合无衬线字体。你可以这样定义：
:lang(zh) {
font-family: "Microsoft YaHei", sans-serif;
line-height: 1.8;
}
<p>:lang(en) {
font-family: Arial, sans-serif;
line-height: 1.6;
}</p>只要 HTML 元素设置了 lang 属性，如 <p lang="zh">你好</p>，对应的样式就会生效。这在多语言网站或用户生成内容中非常有用。
结合语义结构增强可访问性
:target 不仅可用于视觉提示，还能配合 ARIA 属性改善屏幕阅读器体验。例如，在目标元素上动态添加提示信息，说明“已跳转至某章节”。
:lang() 则有助于正确设置引号、连字符断字等语言敏感特性。例如：
:lang(en) > q { quotes: '"' '"'; }
:lang(zh) > q { quotes: "“" "”"; }
这样无论哪种语言的引用内容，都能显示合适的引号形式，保持语义准确。
基本上就这些。善用 :target 和 :lang 能让样式更具上下文感知能力，既减少冗余类名，又提升国际化支持水平。不复杂但容易忽略。
