Question

我有iframe来显示.htm文件的内容，该文件存在于其他位置。在桌面浏览器上，文档可以完美加载。

但在移动版本上，文档的内容不会完全显示。

我正在为移动和桌面视图寻找响应式iframe。

HTML

<iframe
    id="ifrm"
    src="URL.htm"
    width="100%"
    frameborder="0"
    scrolling="no"
    height="1450px"
    style="padding-top: 0px; float: left;" target="_blank"
/>

我提到了这些链接，但不幸的是他们没有帮助：

Full-screen iframe with a height of 100%

Scale iFrame css width 100% like an image

Answer 1

使用iframe中的bootstrap网站

Demo

确保你有

<meta name="viewport" content="width=device-width, initial-scale=1" />

在您文档的<head>中。

Answer 2

尝试这样 LINK

<强> HTML：

<div class="iframe">
    <iframe src="http://a.rgbimg.com/cache1wZTwK/users/m/mi/micromoth/600/oIejAt8.jpg" frameborder="0"></iframe>
</div>

<强> CSS：

.iframe {
    position:relative;
}
iframe, object, embed {
    max-width: 100%;
    min-width: 100%;
}

响应式IFrame，用于显示外部文档中的内容

2 个答案: