如何停止容器DIV上的所有CSS覆盖？

Question

我有一个容器div，我使用bookmarklet添加到外部网站来执行一些功能，我面临的问题是这个div包含一些元素，每个元素都有其内联样式，但是当我放入外部网站时，有时候它会覆盖网站CSS中的样式。

有一种方法可以阻止此div上的任何覆盖吗？

Answer 1

主机网站应该使用！important 通知定义它的CSS属性（颜色：红色！重要;）。

或者您可以使用JavaScript（ jQuery ）将样式附加到DIV。您可以检查DIV是否已经具有样式，以便您可以决定添加或不添加任何样式。

Answer 2

你可以在元素中定义css属性，以便能够正确地显示你的div。

<div style="margin:0;border:1px solid red;">

另外，您也可以使用Div html提供css样式。

当“外部”网站拥有css全球规则时，我知道它很痛苦;例如

ul ( margin-left: 5px; } 

我能做的最好的事情是为我的div id重置所有这些东西。

更新：

是的，我知道他有内联样式，但问题是由全局规则引起的。所以例如如果@Amr ElGarhy的div有UL，他们都会得到5px的左边距（如上所示）。并且Amr ElGarhy也必须重新设置内联样式的边距。

Answer 3

如果托管网站使用了！important，那么你就会被简化为内联样式（再次变坏），但是嘿。

如果他们没有，并且你试图超越的例子就像另一张海报所说：

ul ( margin-left: 5px; }

然后你可以简单地使用选择器加权来确保你的风格比他们的风格重，即

#mycontainingDivElement ul { blah:blah }

因为你的风格有更多的等级（并注意css中的某些东西有不同的权重，即ids与类选择器），无论css表单中的位置如何都会使用它