离子框架：无法创建具有透明背景的iframe

Question

我目前正在尝试使用React创建一个网站，其中我需要在网站内有一个透明的iframe。我尝试了多种方式，所有方法都导致了白色背景。

这个问题似乎在某种程度上是离子框架起作用的，因为我在香草中尝试了相同的片段，并且是有意的。

我已经尝试了从设置允许Transparency =“ true” 到将iframe背景更改为透明的所有方法，但似乎不起作用。总是导致白色背景。

我尝试了这个小片段

html

 <div className="container">
     <iframe className='iframe' allowTransparency src="about:blank"></iframe>
 </div>

css：

.container {
  background-color: red;
  padding: 300px;
}

.iframe {
  background: transparent;
  background-color: transparent;
  width: 50vw;
  height: 50vh;
}

结果：

1. 在

2. 在

更新：更新：

该解决方案是为iframe使用与原始DOM相同的颜色安全。最好由Neea解释：