如何覆盖！重要？

Question

我写了一些html，并将一些css样式注入第三方网站。但是，由于某些 !important 声明，他们的造型混乱了我的。我不想要这个，我不想在我的风格中使用！important。

我该怎么做才能防止这种情况发生？

Example at jsFiddle

Answer 1

！important声明会覆盖其他所有内容，甚至是内联样式和更具体的层次结构。覆盖！important的唯一方法是更具体！重要。

这就是为什么！重要的是应该避免。

Answer 2

使用适合您的适当层次结构定义类。

.list .row span{
   color:red !important;
}

<div class="list">
<div class="row">
    <span>Your text </span>
</div>

尝试做一些类似于我在这里创建的东西。

Answer 3

你可以覆盖！重要的是与大多数人相信的相反。您甚至可以使用此技术覆盖JS或第三方插件（例如Facebook !!）应用的内联样式。最强大的方式是这样的：

td[style] {height: 110px !important;}

它就像将内联样式注入html一样，因为您将样式应用于标记的实际样式属性。内联和！重要的组合应该胜过一切，除了后来应用的样式以及内联和重要的

以下是工作代码的小提琴：http://jsfiddle.net/9LvzP/ 您可以看到，即使background-color: green !important出现在background-color: blue之前，蓝色功能更强大并且已应用