CSS覆盖iframe中内容的正文风格?

我如何控制iframe中的body元素的背景图像和颜色? 请注意,嵌入式body元素有一个类,而iframe是属于我网站一部分的页面。

我需要这个的原因是我的网站有一个黑色的背景分配给正文,然后分配给包含文本的div的白色背景。 所见即所得编辑器在编辑时使用iframe嵌入内容,但它不包含div,因此文本很难阅读。

当编辑器中的iframe的主体有一个没有在其他地方使用的类,所以我假设这是放在那里,所以这样的问题可以解决。 但是,当我将样式应用于class.body时,它们不覆盖应用于body的样式。 奇怪的是这些样式确实出现在firbug中,所以我不知道发生了什么事情!

谢谢

更新 - 我曾尝试@ mikeq的解决方案,即将类型添加到身体类的类中。 添加到主页面样式表时这不起作用,但在添加萤火虫时它确实有效。 我假设这是因为firebug应用于页面上的所有所有元素,因为css没有应用在iframe中。 这是否意味着用javascript加载窗口后加入css会起作用?


iframe是页面中的一个“洞”,在其中显示另一个网页。 iframe的内容不是任何形状,也不构成父页面的一部分。

正如其他人所说,你的选择是:

  • 给iframe中加载的文件提供必要的CSS
  • 如果iframe中的文件来自与您的父级相同的域,那么您可以从父级访问iframe中文档的DOM。

  • 以下仅适用于iframe内容来自同一父域的情况。

    以下jquery脚本适用于我。 在Chrome和IE8上测试。 内部iframe引用与父页面位于同一个域的页面。

    在这种特殊情况下,我在内部iframe中隐藏了一个具有特定类的元素。

    基本上,你只是在内部iframe的'头部'附加'style'元素。

    $('iframe').load( function() {
        $('iframe').contents().find("head")
          .append($("<style type='text/css'>  .my-class{display:none;}  </style>"));
    });
    

    除非您有直接访问权,并且因此拥有源html和/或css文件,否则不能更改iframe中显示的页面样式。

    这是为了阻止XSS(Cross Site Scripting)

    链接地址: http://www.djcxy.com/p/89903.html

    上一篇: CSS override body style for content in iframe?

    下一篇: digit inputs in Assembly