• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • :lang()

    定义和用法

    • :lang(),匹配带有lang属性的元素。在HTML文档中,元素的语言由其lang属性确定。
    • :lang(),它适用于具有相关联的语言编码信息的任何元素。
    • :lang(),基于其人类语言编码匹配元素。这种语言信息必须包含在文档中或以其他方式与文档相关联。处理:lang与|=属性选择器相同。

    语法:

    E:lang(fr){sRules}

    匹配使用特殊语言的E元素。注意:值是整个单词,例如lang="en",或者使用连字符(-)如lang ="en-us"

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

    浏览器支持

    对所有元素IE8以及新版本浏览器均支持:lang()选择器。

    示例

    每个<p>元素lang属性值等于"it"的选择的样式:

    p:lang(it)
    {
      background:yellow;
    }
     

    在这个例子中,: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'; }
    

    下篇::not()