CSS样式的结果不是我所期望的答案

【问题标题】：The result of CSS styles is not what I expectCSS样式的结果不是我所期望的
【发布时间】：2015-07-27 06:36:11
【问题描述】：

I have the following html that is using Bootstrap stylesheets: <button class="label btn-lg">Save</button> My understanding of CSS Specificity rules that btn-lg overrides label values (When selectors have an equal specificity value, the latest rule is the one that counts ）。但是，无论我对类使用哪种顺序，标签都会取代 btn-lg

如何让 btn-lg 覆盖标签？

【问题讨论】：

如果没有看到您的 CSS，这将是一个难以破解的难题。此外，它不是将类应用于元素的顺序，而是它们在样式表中的顺序会影响特异性。

标签： css twitter-bootstrap css-specificity

【解决方案1】：

"When selectors have an equal specificity value, the latest rule is the one that counts" 这意味着将应用样式表中最低的 CSS 规则。因此，在您的情况下， .label 类出现在引导样式表中的 .btn-lg 之后。

希望对您有所帮助。

【讨论】：

鉴于这两个类都在股票引导文件中，我认为没有办法让 .label 类占上风（显然，没有创建我的类，或者在其中创建跨度，或者同样笨拙的东西）。对吗？

【解决方案2】：

“最新规则”是指 CSS 文件中的最后一条规则，而不是按类顺序。

链接到同一文件中的规则： https://github.com/twbs/bootstrap/blob/master/dist/css/bootstrap.css#L3491 https://github.com/twbs/bootstrap/blob/master/dist/css/bootstrap.css#L4897

【讨论】：

我希望我也能接受这个回复 - 两个非常相似且同样正确的答案相隔几分钟；）