重复伪类选择

我在引导CSS文件中注意到：重复伪类选择

input:focus:invalid:focus, 
textarea:focus:invalid:focus, 
select:focus:invalid:focus { 
    border-color: #e9322d; 
    -webkit-box-shadow: 0 0 6px #f8b9b7; 
     -moz-box-shadow: 0 0 6px #f8b9b7; 
      box-shadow: 0 0 6px #f8b9b7; 
s}

看来：重点是指定了两次输入，文本区域，并选择;这是否有特定的功能？

来源

2013-08-27 cardinal19821

这增加了CSS选择器的specificity。

这里是在css规范的相关报价：

注：相同的简单选择的重复出现是允许的，不增加特异性。

因此，在这种特殊情况下，input:focus:invalid:focus将优先于input:focus:invalid。

这里是一个simpler example展示反复出现次数在css特异性增加：

CSS

span.color.color { 
    color: green; 
} 

span.color { 
    color: yellow; 
}

HTML

<span class="color">This will be green.</span>

来源

2013-08-27 21:03:18 edsioufi

在这种情况下，将输入：重点：无效无效？以上给出示例的块为： 'input：focus：invalid， textarea：focus：invalid， select：focus：invalid { color：＃b94a48; border-color：＃ee5f5b; }' – cardinal19821

我不想说它永远不会被应用，因为，TBH，我将无法解释Bootstrap中的用法，除非它用于注释掉上面的块，同时将它保留在源中...此外，如果我没有弄错，这是来自BS2.3.2，所以今天很难问，为什么在当时增加了这个功能...... – edsioufi

重复伪类选择

回答

相关问题