我创建了一个基于Javascript的元素，可以嵌入到网站中。 Javascript本身将HTML代码添加到预定义的HTML容器中，并动态加载包含元素可视定义的必要CSS文件。
当网站本身有一般项目的定义时，问题就开始了。例如：网站的CSS定义了一个应用于元素列表的特定列表样式，因为元素的CSS没有定义显式的列表样式，或者网站的CSS是否覆盖了元素的CSS定义。
目前，我能够通过明确定义列表的样式并添加！important定义来解决这个特定问题。但是，我肯定希望找到一个更强大的解决方案，以确保： 1.网站CSS中未在元素CSS中明确定义的CSS定义将不会应用于元素 2.我不需要在每个CSS定义中明确添加！important定义
是否有一般的方法可以指定网站的CSS不会应用于某个元素，或者只有某个CSS会应用于特定元素？
非常感谢任何帮助。
答案 0 :(得分：6)
您需要使用本地化重置。
抓取现有的CSS重置，例如Eric Meyer's Reset Reloaded，并使用您的父元素命名所有选择器，例如#something a { ... }。
答案 1 :(得分：4)
我会像亚历克斯一样提出同样的答案，但是他打败了我 - 但我还要补充一下：
如果您不打算使用@ alex的建议，那么最终您必须以您希望它们出现的方式明确地设置所有元素的样式;使用选择器将样式保持在本地（并且不会干扰父站点） - 与建议本地化重置的方式相同。
或者你可以做谷歌翻译和许多其他小部件类型的事情，通常是禁止，但在动态场景中，我认为完全可以接受;因为元素的视觉风格不仅对您而且对容器站点很重要：使用内联样式。
最终更新
所以我想我只是仔细检查Google翻译的功能。当然除了使用内联样式之外，它还是一个iFrame注入。毫无疑问，它们使用内联样式来最大化兼容性，因此浏览器不必另外请求获取样式表;他们将使用iFrame，以确保外观和感觉一致。
同时考虑这两个点 - 并且权衡重置页面的少数部分的所有样式可能需要的工作量;或者为你需要控制的每个CSS属性定义规则 - 让我们面对它，基本上是所有可视CSS属性。
iFrame解决方案实际上似乎提供了最佳解决方案 - 如果您可以使用它;因此，我已经在@roberkules的第一条评论中为你的问题+1了。