javascript - iframe 全屏 100% 宽度

Question

我已经成功地使用以下代码制作了一个显示页面特定部分的 Iframe:

<div id="divContainer" style="display: block; margin-left: auto; margin-right: auto;">
     <div id="frameContainer" style="overflow:hidden;">
          <iframe src="http://www.cofm.es/informacion-corporativa/buscador-farmacias" scrolling="no" style="width: 1000px; height: 750px; margin-top: -330px; margin-left: -250px;" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe><br />

</div>

来源:iframe to Only Show a Certain Part of the Page

现在我要做的是让 Iframe 在屏幕上以 100% 的宽度显示。我已经能够使用以下代码对图像执行此操作:

<img style="width: 100%; display: block; margin-left: auto; margin-right: auto; " src="http://i.ytimg.com/vi/ROv863DuJu4/maxresdefault.jpg" />

我试图让 iframe 像图像一样适应屏幕大小。

Answer 1

Iframe 是一个内联元素 - 您需要设置 css“display:block” - 然后您可以将其设置为 100% 并且它会缩放 - 希望这有帮助。这是一个示例 - 您还必须将包含元素设置为全宽..

<iframe style='display:block;width:100%' src='http://someurl.com'></iframe> 

  https://jsfiddle.net/cqgfqgqk/