如何使用 HTML IFrame 自动调整宽度

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23218332/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 01:35:58  来源:igfitidea点击:

How to do auto-width with HTML IFrame

htmliframe

提问by Kleyson Rios

I am trying to use iframe to open other URLs. But for reason the width iframe is fixed in 155px.

我正在尝试使用 iframe 打开其他 URL。但出于原因,宽度 iframe 固定在 155px。

I need to resize the width iframe to fit the whole SRC iframe.

我需要调整宽度 iframe 以适合整个 SRC iframe。

<!DOCTYPE html>
<html>
    <body>
        <iframe frameborder="0" scrolling="no" height="100%" width="100%" src="http://www.gnu.org/"></iframe>
    </body>
</html>

I tried width="100%", but didn't work.

我试过 width="100%",但没有用。

回答by 4dgaurav

Demo

Demo

html, body {
    height:100%;
    width:100%;
    margin:0;
}
.h_iframe iframe {
    width:100%;
    height:100%;
}
.h_iframe {
    height: 100%;
    width:100%;
}

HTML

HTML

<div class="h_iframe">
    <iframe src="//www.youtube.com/embed/9KunP3sZyI0" frameborder="0" allowfullscreen></iframe>
</div>

回答by Tuhin

try this:

尝试这个:

    <iframe 
        src="http://www.gnu.org/" 
        frameborder="0"
        scrolling="no" 
        style="overflow:hidden;height:100%;width:100%" 
        height="100%" 
     width="100%"></iframe>

回答by Mathijs Segers

You should just be able to do this with CSS

你应该能够用 CSS 做到这一点

for example.

例如。

style="width:100%"

I just pasted your HTML into a fiddle. And it works as intended. Do you have any css overruling the width, or is it inside a container which is 155px wide where you actually use it?

我只是将您的 HTML 粘贴到小提琴中。它按预期工作。您是否有任何 css 超过了宽度,或者它是否在您实际使用它的 155px 宽的容器内?

That works for me at least.

这至少对我有用。