根据层叠顺序，优先级相同的样式，如何判断哪一条声明会起作用

根据层叠顺序，优先级相同的样式，如何判断哪一条声明会起作用，取决于对其选择器特殊性的计算值。

如上代码中，多个样式中的 background-color 同时作用于content，那么最后，到底content应该会是什么颜色呢？

这就应该求助于选择器特殊性的计算规则了。

特殊性的值可以看作是一个由四个数组成的一个组合，用 a，b，c，d 来表示它的四个位置。 依次比较 a，b，c，d 这个四个数比较其特殊性的大小。比如，a 值相同，那么 b 值大的组合特殊性会较大，以此类推。 注意，W3C 中并不是把它作为一个 4 位数来看待的。

元素名和伪元素的数量是 d 的值；比如上面例子中的 ‘div‘

现在，应用上面的规则，计算例子中各个样式的特殊性的值，结果为：

W3C 官方给出的例子：

如上代码中，P 中字体的颜色应该为绿色。