如何使用 HTML 将 iframe 放置在另一个宽度和高度相同的 iframe 上

Question

我正在尝试运行以下代码，这样每当我单击 link 时，相应的页面就会显示在 iframe 中。我正在尝试覆盖 iframes，但代码似乎没有按预期工作。

<iframe name="IFrame1" style="width: 200px; height: 200px;   display: block;position: relative;" src="https://www.link1.com"></iframe>

<iframe name="IFrame2" style="width: 200px; height: 200px; top: 10px;left: 10px;display:block;position: absolute;" src="http://www.link2.com"></iframe>


<p><a href="https://www.link1.com" target="IFrame1">link1</a></p>
<p><a href="http://www.link2.com" target="IFrame2">link2</a></p>

请帮助我克服它。

Answer 1

您只能使用单个 iframe。

<iframe name="IFrame1" style="width: 200px; height: 200px;   display: block; 
position: relative;" src="https://www.link1.com">
</iframe>


<p><a href="https://www.link1.com" target="IFrame1">link1</a></p>
<p><a href="http://example.com/" target="IFrame1">link2</a></p>

Answer 2

iframe {
  width:200px;
  height:200px;
  position:absolute;
  border:solid 1px #000;
}


#front {
  position:absolute;
  border:solid 1px #000;
  width:100px;
  height:100px;
  left:120px;
  top:120px;
  background:#f00;
  box-shadow:0 0 10px #666;
  
}

<iframe src="https://www.link1.com"></iframe>
<div id="front">
<iframe src="https://www.link1.com"></iframe></div>

一般来说，将 DIV 放在 iFrame

之上应该不是问题

如何使用 HTML 将 iframe 放置在另一个宽度和高度相同的 iframe 上

How to place an iframe over another iframe of same width and height using HTML

html

iframe

href