定义颜色属性的多个类的优先级由声明顺序而不是规范顺序设置

Question

鉴于定义颜色属性的两类具有相同的特异性,我认为元素类属性中列出的最后一个类优先.

来自http://htmlhelp.com/reference/css/structure.html:

规范顺序为了方便起见,当两个规则具有相同的权重时,指定的最后一个规则获胜.

在下面的真空代码示例中,定义类规则集的顺序决定了优先级.这里最后一个或最近的类规则集定义优先.

<style>
    .makeBlue {color: blue;}
    .makeGreen {color:green;}
</style>
<div>
    <p class="makeGreen makeBlue">makeGreen makeBlue</p>
    <p class="makeBlue makeGreen">makeBlue makeGreen</p>
</div>

输出文本为绿色.

如果我交换了类声明的顺序,并首先声明.makeGreen

<style>
    .makeGreen {color:green;}
    .makeBlue {color: blue;}        
</style>
<div>
    <p class="makeGreen makeBlue">makeGreen makeBlue</p>
    <p class="makeBlue makeGreen">makeBlue makeGreen</p>
</div>

输出文本为蓝色.

我以前从未注意过这一点.编辑我认为编辑元素类属性中列出的最后一个类优先.

编辑 澄清 - >我有时会想到一个元素作为宠物,让我们说一只狗.我看到在元素的class属性中添加一个类作为发出dog命令.如果我告诉它坐下,然后告诉它躺下,我希望狗躺下.我不认为这只狗会保持坐着,因为我教它如何坐下(最近比)我教它如何躺下.

所以...两个问题.

1. 这是怎么回事？回答
2. 如果是这样......为什么？我无法看到必须挖掘类声明以确定哪一个在另一个之前声明的优点.

非常感谢!

Answer 1

在元素上指定类的顺序是无关紧要的.这是您在风格声明中定义它们的顺序.您发布的引用表示样式声明,而不是类在元素上列出的顺序.