CSS类将不会改变现有的类属性

#app-container ul.apps li.app1 { 
    border-color:#57b6dd; 
    background:url(app-icons/app1.png) no-repeat 10px 10px; 
}

<li class="app1">

现在假设我有同样的李在页面再次出现，但我想将边框颜色更改为托盘，将类添加到现有类不会更改颜色。

.app-inactive-border { 
    border-color: #666666; 
}

<li class="app1 app-inactive-border">

我在做什么错？由于

.app-inactive-border小于specific然后#app-container ul.apps li.app1

在多个规则集提供改变相同的属性，最具体的规则集胜的规则。

使用#app-container ul.apps li.app1.app-inactive-border

2012-06-14 14:02:43 Quentin

我对此不积极，这就是为什么我没有提交作为答案，但不会将其标记为重要覆盖其他规则？ *编辑*我的坏，只是读其他答案，它提到重要 – Tony318

它会的，但'重要'是邪恶的。这是一个单杆击球手，往往会让你处于不得不使用更具体的选择器*和*重要的位置。 – Quentin

好的谢谢你的回复。我还没有用过！重要的是，我只是对它的用途有一个总体的了解。但它似乎并不是最佳实践。谢谢你的解释。 – Tony318

另一种方式是这样：

.app-inactive-border { border-color: #666666!important; }

其中庸之道知道什么是 “重要！” 的作用。但Quentin答案是一个最佳实践和更可读的语法。

last thing : you can simplify the hexa color code like this #666;

2012-06-14 14:23:01 Mouloud

回答