怎么让iframe自适应浏览器的高度和宽度

怎么让iframe自适应浏览器的高度和宽度,第1张

让iframe自适应浏览器的高度和宽度的具体步骤如下:

1、首先设置样式:body{margin:0padding:0}。

2、如果不设置body的margin和padding为0的话,页面上下左右会出现空白。

代码如下:<iframe src=://fulibac id="myiframe" scrolling="no" frameborder="0"></iframe>。

3、这个方法可以达到让iframe自适应高度的效果,但是如果将窗口放大或缩小效果就不出来了,也就是本文开头讲的。

需要再次刷新,那就不属于自适应了。

代码是:

var ifm= document.getElementById("myiframe")

ifm.height=document.documentElement.clientHeight

iframe的高度可以随内容的多少而变化,解决方法如下:

1、首先在文件夹里创建两个html文件,一个“index”一个“iframe”。

2、然后在index中添加一个iframe标签,直接嵌入iframe页面。

3、接着在iframe网页中添加了两个固定高度的div内容。

4、浏览器打开index页面,发现iframe部分有滚动条,需要滚动显示页面。

5、现在在index页面的iframe标签再添加如下的属性。再次打开index页面iframe已经高度自适应了。

设置 子iframe 设置高度:

一、iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。

二、有以下方式对iframe进行设置高度和宽度

1、iframe元素标签可以使用width和height属性,

<iframe src ="/index.html" width="400" height="300"></iframe>

2、可以使用css来定义宽度和高度

<iframe src ="/index.html" style="width:400pxheight:300px"></iframe>


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/tougao/10957437.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-12
下一篇2023-05-12

发表评论

登录后才能评论

评论列表(0条)

    保存