Javascript 限制动态内容css属性

我正在制作一个chrome扩展，在页面加载时将html元素添加到用户页面内容中。扩展插件插入的元素的样式在扩展插件的css中指定。这基本上很好用

问题是：有时我会对扩展的元素产生样式问题，因为用户访问的站点有一个样式表，它的样式为

*{…}

或

img{…}

，并且样式应用于扩展的元素

---

我想找到一种方法来确保我的chrome扩展插件插入到网站页面内容中的html元素只受我的css影响，而不受用户访问的网站的css影响。实现这一点的一种方法是，我给出了大多数html元素类型，比如

，而不是

。然而，这在网站使用

*{…}

的情况下不起作用，我无法避免在我的扩展的html中使用

元素，因此它们经常受到影响。

我不认为你可以反对每个可能的网页的CSS。您最好使用命名元素并使用大量的！问题的内容与CSS继承无关（CSS继承是最被广泛误解的概念）。它很模糊，似乎是针对使用CSS的东西，但却违背了CSS的基本原则，比如cascade.@JukkaK.Korpela很抱歉使用了继承这个词。固定的。我的问题有多含糊？我举了一些例子，并解释了我的尝试。@NaNpx不幸地使用了！重要提示：仅停止覆盖属性。如果源css中有我在自己的css中没有指定的属性，则无法阻止它应用于我的html元素。@JukkaK.Korpela此外，我无法控制源页面css。我的扩展是动态插入html元素，并向源css动态添加css。在这种情况下，我没有办法严格遵循css原则，这就是我在这里的原因。