Question

关于Stack Overflow的一些主题如下：

Full-screen iframe with a height of 100%
How do you give iframe 100% height [duplicate]
Make Iframe to fit 100% of container's remaining height

我想在我的网页上嵌套iframe。我正在使用bootstrap来设置网页样式，所以我使用了以下代码：

<div class="col-sm-6" style="margin:0px;padding:0px;overflow:hidden">
    <iframe id="iFrame1" src="<test_link_here>" frameborder="0" style="overflow:hidden;height:100%;width:100%" height="100%" width="100%"></iframe>
</div>

不幸的是我的iframe没有调整到全高。我想以某种方式将其自动调整到全高。你知道我怎么能实现它吗？

Answer 1

通过将height : 100%;值更改为height : 100vh;，您可以实际完成所需的操作。 vh 是一个名为ViewHeight的单位，您的全屏高度实际为100vh;

以下是关于Mozilla团队长度单位的a post。

试试这段代码：

<div class="col-sm-6" style="margin:0px;padding:0px;overflow:hidden">
    <iframe id="iFrame1" src="http://www.stackoverflow.com" frameborder="0" style="overflow:hidden;height:100vh;width:100%; border : 1px solid red;"></iframe>
</div>

高度等于100％不适用于IFrame

1 个答案: