覆盖页脚小部件样式表中使用的重要属性

Question

我有一个Twitter小部件，它被加载到我页面的页脚中。问题是它在整个地方都使用了！重要的属性。而且由于我的样式表都被加载到头部，因此窗口小部件的样式表会自动覆盖我的样式表。

我是否真的必须在我的文档的页脚中放置几个​​单独的样式，在窗口小部件下面，以强制执行此操作。或者是否有更多的语义方法？

Answer 1

我会查看是否有办法让你的CSS比推特中使用的选择器更加specific。特殊性规则将确保您的!important样式覆盖twitter !important样式。

否则，作为最后的手段，如果!important仅用于Twitter CSS中的类，那么您可以为被覆盖的任何内容分配id，以确保您的选择器更具体。< / p>

/* your style */
#anti_twitter a.link {
    color: blue !important;
}

/* twitter style */
a.link {
    color: red !important;
}

因此，使用上面的代码，链接将显示为蓝色。

JSFiddle：http://jsfiddle.net/9T9uk/

Answer 2

<div id="myWrapper">
     <div id="theDefaultId">
       ....
     </div>
</div>

您可以使用#myWrapper #theDefaultId { anything: value !important; }

theDefaultId是Twitter小部件使用的ID，#myWrapper是我们定义的ID。

这应该有用。