JSFiddle

Question

尝试使用iFrame＃：

将博客嵌入我们的html网站

<h1 class="title">All the latest...</h1>
</br>
</div>
    </div>
        </div>
        <iframe src ="http://inspireacademy.tumblr.com" width="100%" height="auto">
        <p>Your browser does not support iframes.</p>
        </iframe>

我已经尝试将高度更改为100％，自动甚至多个固定宽度，但iframe的高度保持完全相同！有帮助吗？

提前致谢，

艾

Answer 1

如果您使用百分比，则包含元素必须具有高度，否则iFrame将不知道该百分比的基础。如果你给身体100％的高度，然后给iFrame 100％的高度，它将填充窗口的整个高度。

此外，我建议不要使用内联CSS，而是将CSS规则放入CSS文件中。

HTML：

<body>
<iframe src ="http://inspireacademy.tumblr.com">
    <p>Your browser does not support iframes.</p>
</iframe>
</body>

CSS：

body {
    height:100%;
}
iframe {
    height:100%;
    width:100%;
}

JSFiddle

Answer 2

您必须设置包含div的高度。高度auto使用元素所在的容器来设置高度。高度仅在容器中作为百分比起作用。

<h1 class="title">All the latest...</h1></br>
</div>
    </div>
        </div>
        <div style="height:400px;">
            <iframe src ="http://inspireacademy.tumblr.com" width="100%" height="auto">
                <p>Your browser does not support iframes.</p>
            </iframe>

然后它将扩展到容器。

HTML iframe不会变得更高

2 个答案:

JSFiddle