4

I've developed a dynamic ad banner that consits of html and styles loaded into the host site via javascript. On one particular site, certain styles in the stylesheet for the main page are affecting the html that I'm dynamically loading.

Is there a technique for having the dynamically loaded html only render styles from the css I have loaded along with the html, and ignoring any styles in the host page?

Any advice appreciated.

4

6 回答 6

2

将您的横幅放入 iframe。

于 2012-07-10T11:17:07.837 回答
0

是的，有一个真正简单的方法。为什么不将您的类与主页 HTML 分开。如果您希望没有冲突，请给他们一个唯一的标识。

例子

您的主页有一个 css 类.input 给您的动态加载页面，因为.Dybamically_input这将作为命名空间提供服务。您也可以使用!important您肯定要添加的属性。

于 2012-07-10T11:17:09.437 回答
0

有一个不断发展的标准来向 CSS 引入范围块，但它还没有得到足够的支持而无法使用。您可以使用 !important 指令，但如果您不仔细应用它，这也可能会影响基础文档。

最好的解决方案是通过将添加横幅中的所有 HTML 包含在具有唯一命名类的 div 中来创建范围（并使用您自己的命名空间，例如 'cog_myAd' 来尝试保证唯一性。然后将样式仅应用于该类, 使用 !important 您可能需要覆盖可以在样式级联下更改的样式。

于 2012-07-10T11:17:44.340 回答
0

如果您已将 CSS 文件附加到 HTML 页面，那么唯一的解决方案是使用!important所有冲突的 CSS 属性 -

.className{
  color: red !important;
}
于 2012-07-10T11:20:01.540 回答
0

将 !important 添加到您的 CSS 中，例如

p {颜色：#ff0000！重要；}

于 2012-07-10T11:14:52.923 回答
-1

使用内联样式（您想要设置样式的所有横幅元素的样式属性）而不是外部 css 文件 - 这样您就不会发生冲突。

其他人建议的另一个选项是使用 IFrame。

于 2012-07-10T11:18:15.333 回答