想象一下，CSS声明中的每个规范都为该声明的值添加了一定数量的点。让我们说点要这样(完全弥补，无论如何)：

>标签名称(‘a’，’div’，’span’)：1点
>类名(‘.highlight’，’.error’，’.animal’)：10分
> ID(‘#main-headline’，’#nav’，’#content’)：100分

所以，以下声明：

a {
    color: #00f;
}

.highlight a {
    color: #0f0;
}

#nav .highlight a {
    color: #f00;
}

分别为1,11和111分。对于给定的标签，与其匹配的点数最多的声明“获胜”。所以例如，使用这些声明，所有的标签都将是蓝色的，除非它们位于具有“highlight”类的元素中，在这种情况下，它们将是绿色的，除非该元素在id =“nav “在这种情况下，他们会变红。

现在，如果你只使用课程，你可以把自己变成棘手的情况。假设您希望将内容区域中的所有链接都显示为蓝色，但是您的foo区域中的所有链接均为红色：

.content a {
    color: #00f;
}

.foo a {
    color: #f00;
}

按照我以前(组成)的规模，这两个都有11点。如果你的内容中有一个foo，哪一个胜利？在这种情况下，由于后果而获胜。现在，也许这就是你想要的，但这只是幸运的。如果您稍后改变主意，并希望内容获胜，则必须更改其顺序，并且根据CSS文件中声明的顺序是一个坏主意。现在，如果相反，你有以下声明：

#content a {
    color: #00f;
}

.foo a {
    color: #f00;
}

内容总是会赢，因为该声明的值为101(击败foo的11)。无论他们进入什么秩序，内容声明都将永远都是愚蠢的。这为您提供了一些非常重要的一致性。获胜者不会根据文件中更改的订单进行任意更改，如果要更改获胜者，则必须更改声明(可能在.foo声明前添加一个#content，因此它将具有111点)。

因此，基本上，价值观的差异是重要的，如果你只是使用类，你会得到很多不一致和看似任意的赢家。