解决方法
这会增加css选择器的
specificity.
以下是css规范中的相关引用:
Note: Repeated occurrences of the same simple selector are allowed and do increase specificity.
因此,在这种特殊情况下,输入:focus:invalid:focus将优先于输入:focus:invalid.
这是一个simpler example,证明css特异性随着重复出现而增加:
CSS
- span.color.color {
- color: green;
- }
- span.color {
- color: yellow;
- }
HTML
- <span class="color">This will be green.</span>