无法使用!important属性覆盖内联样式？

Question

我有一个如下定义的 div：

<div style="background-color: rgb(217, 240, 211) ! important; color: rgb(0, 102, 2) ! important;" class="div_box">... ...
</div>

由于该div当前正在使用内联样式（我讨厌这个！），因此我需要覆盖背景颜色以及颜色。

我尝试过：

.div_box[style] {
background-color: rgb(216, 219, 215) ! important; 
color: rgb(94, 94, 94) ! important;
}

但是它没有生效。我还尝试过使用".div_box { ... }"，但仍然不起作用。

所以我的问题是，如何在不手动更改内联样式的情况下覆盖上述div样式？

- Josh

---

!important应该没有空格，紧贴着最后一个值写 :) 颜色：rgb(94, 94, 94)!important; - G-Cyrillus

你不能覆盖内联 !important 样式。 - bwoebi

一篇关于CSS中特异性的文章，值得一读 :) - naththedeveloper

在这种情况下，特定性并没有帮助。 - Archonic

@G-Cyr 你救了我的命。 - Jim W says reinstate Monica

Answer 1

http://jsfiddle.net/UkpnZ/3/

如果您无法删除内联样式，那么可以使用Jquery，代码如下：

$('.div_box').css('background-color', '');
$('.div_box').css('color', '');

要从 .div 盒子出现的内联样式中删除 background-color 和 color 属性。唯一需要注意的问题是它将在调用该类的任何地方都执行此操作。

使用此方法，您不再需要在样式表中使用 !important。

- Andrew Clody

---

所以我的问题是，我如何在不手动更改内联样式的情况下覆盖上述div样式？- 请阅读 - Adrift

我知道我可以随时使用JavaScript / jQuery来删除/更改这些样式，但我更喜欢使用CSS进行覆盖。很遗憾，由于内联被标记为！important，因此无法执行此操作。 - Josh

Answer 2

内联CSS会覆盖CSS样式表。在您的情况下，两者都被标记为! important，因此您无法使用此CSS技巧更改div颜色。

简短回答：您不能做您想要的事情。只有当内联CSS未被标记为! important时才可能实现。

- Gimmy

---

True。对于这个示例，一种解决方法是使用具有大扩展的插入式box-shadow。.div_box { box-shadow: inset 0px 0px 0px 300px rgb(216, 219, 215); } - Jesse Fisher