Html css-不是选择器-中断优先级？

在css文件中，最后定义的样式优先于以前定义的样式

但是当使用

非选择器

时，优先级会被打破，带有

非选择器

的类会获得优先级，即使它位于文件的顶部

优先级中断背后的逻辑是什么？

.red加not:not（.something）{
背景：红色；
}
瑞德先生{
背景：红色；
}
蓝先生{
背景：蓝色；
}
预期的蓝色问题
期待蓝色-太好了！

结果:

---

对于

.red加上not:not（.something）

的特异性为'0020'，而对于

.red

或

的特异性为'0010'。因此，
.red优先于not:not（.something）



请参阅以了解更多信息。
您说：

在css文件中，最后定义的样式优先于上一个样式
定义的

别那么快。。。具有更高特殊性的类优先于类在CSS中出现的顺序！（-注意列表中'specification'如何出现在'order of appearance'之前）

那么，您如何计算上述类别的特异性呢

从：

否定伪类中的选择器与其他选择器一样计数，
但是否定本身并不算作伪类

因此，选择器的特异性
.red加上not:not（.something）
=

/* a=0 b=2 c=0 -> specificity = 020 (two class selectors) */

在哪里

a
=#选择器中的ID选择器

b
=#选择器和中的类选择器、属性选择器和伪类

c
=#类型选择器和选择器中的伪元素

与其他选择器相比，
.red
和
.blue
——它们的特异性仅为010（一个类别选择器）


如果您感兴趣，这是计算特异性的一个很好的参考

/* a=0 b=2 c=0 -> specificity = 020 (two class selectors) */