如何制作带不透明背景的全屏 iframe？

Question

我可以创建一个占据整个屏幕的iframe。但是我无法隐藏背景内容，换句话说，我想要一个不透明的iframe。我目前尝试的方法是：

   <iframe name='myifrmae' allowtransparency = 'false' background= '#FFFFFF' id = 'myiframe' src = 'main.html' 
     style='position:absolute; top:0px; left:0px; width:400px; 
            height:100%;z-index:999' onload = 'sendParams();'' frameborder='no'>
   </iframe>

我正在Firefox/3.5.6上进行测试。

我有做错什么吗？

更新： 我给main.html的body设置了BGCOLOR =“#FFFFFF”，现在它可以正常工作了。感谢您的建议！

- Manohar

---

我认为你尝试发布的代码已经神秘地消失了。 - Eric Mickelsen

现在它回来了！我忘记添加代码块了。 - Manohar

Answer 1

尝试：

<iframe name='myiframe' id='myiframe' src='main.html' 
 style='position:absolute; top:0px; left:0px; width:100%; height:100%; 
        z-index:999' onload='sendParams();' frameborder='no'>
</iframe>

您不需要设置allowtransparency=false，因为这是默认设置。此外，有一些额外引号的错误。我还纠正了name属性的拼写。

我已将宽度更改为100％，而不是固定宽度400像素，以确保填充整个窗口。

- Camsoft

---

我刚试了一下，它确实占用了100%的空间，但我仍然可以看到父HTML的内容。我想让它变得不透明，感谢您的快速回复。 - Manohar

你能提供一些父页面和可能的main.html页面的HTML示例吗？我在提供的示例代码中看不到iframe透明的任何原因。你有任何可能会操作iframe不透明度设置的JavaScript或CSS吗？ - Camsoft

我检查了一个样本，它的行为与你上面解释的一样。但是在我的应用程序中，行为并不相同。是的，有一些流氓CSS导致了这种行为，感谢你指出来。我会检查一下并更新发现。 - Manohar

只需添加 background:white，即可使 iframe 不透明，它会起作用的;-) - Abduliam Rehmanius

Answer 2

为什么不使用一个带有 iframe 的不透明的 div 呢？

- matpol

---

实际上，这个 iframe 在一个 div 下面，但是让我看看如何使它不透明。 - Manohar

Answer 3

allowtransparency = 'false'

听起来不是一个很好的开始？

尝试设置 allowtransparency = 'true'

然后确保 iframe 内部的内容透明度设置为透明。

- Andrew M

---

我不想允许透明度，所以我将其设置为false。我想加载一个全屏不透明的iframe，它会覆盖在父级内容上方。 - Manohar

Answer 4

如果要全屏显示 iFrame，您需要在样式中添加 margin:auto;。

- Joshua