如何在IFrame中落入样式时如何应用样式？

Question

我正在尝试隐藏IFrame中显示的内容的某些元素，因为它属于IFrame标记。我可以控制基页和要在IFrame中显示的页面的CSS（它们可以在不同的域上运行）。我认为我应该能够在IFrame内容的HTML中定义样式表规则，该规则仅适用于下面示例的元素，但它不起作用。这是可能的，如果是这样，我做错了什么？

<style>
iframe div.header
{
    display:none;

}
</style>

编辑：为了澄清，我正在尝试仅在页面位于iFrame中时应用样式。主要问题是，当我们在其他网站的某个网站上显示内容时，我希望隐藏页眉和页脚。对我来说，我应用上述风格来实现这一目标是合乎逻辑的。为什么我不能编写仅适用于属于iFrame的元素的CSS规则（该规则可以在任一文件中，只要它有效）？我已经在主页面和iframe内容页面中尝试过该规则。

Answer 1

您无法更改/控制其他域上的页面。有关详细信息，请参阅Same origin policy。

此外，应用这样的样式即使它们位于同一个域上也不会起作用b / c iframe中的内容是独立于父页面呈现的。

如果您有权访问这两个页面，为什么不将该样式放在iframe中显示的页面上？

Answer 2

我认为最接近的是在iFrame中使用Javascript来检查当前文档是否是根文档。

如果然后忽略，如果没有则将类应用于正文

Answer 3

尝试为iFrame大小编写规则，与移动设备相同：

@media (width: 500px) and (height: 350px) {
    .header{visibility:hidden}
}

如果iFrame宽500像素，高350像素。

唯一的问题是，我不确定对移动设备的影响是什么...... 但是我刚刚在一个网站上试过它并且它有效。