:lang

 

:lang() CSS 伪类基于元素语言来匹配页面元素。

/* 选取任意的英文（en)段落 */
p:lang(en) {
  quotes: '\201C' '\201D' '\2018' '\2019';
}

注意: 在HTML中, 语言是通过lang 属性,和 <meta> 元素的组合来决定的, 也可能是通过协议的信息来确定（例如HTTP头）. 对于其他文档类型，也可能存在其他用于确定语言的方法。

语法

正式语法

:lang( <language-code> )

参数

<language-code>
 <string> 代表了你想定位的语言. 可接受的值为在HTML 规范中指定的值.

Example

在这个例子中, :lang() 伪类使用子选择器来匹配引用元素(<q>)的父元素. 需要注意的是，此处演示的方法并不是唯一的，最好的方法需要依据文档类型来确定。还需要注意的是， Unicode 值用于指定一些特殊字符的引用.

HTML

<div lang="en"><q>This English quote has a <q>nested</q> quote inside.</q></div>
<div lang="fr"><q>This French quote has a <q>nested</q> quote inside.</q></div>
<div lang="de"><q>This German quote has a <q>nested</q> quote inside.</q></div>

CSS

:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
:lang(fr) > q { quotes: '« ' ' »'; }
:lang(de) > q { quotes: '»' '«' '\2039' '\203A'; }

Result

规范

规范 状态 Comment
Selectors Level 4
:lang()		 Working Draft 无变化.
Selectors Level 3
:lang()		 Recommendation 没有明显的变化.
CSS Level 2 (Revision 1)
:lang()		 Recommendation 最初的定义。

浏览器兼容性

BCD tables only load in the browser

参考