html iframe高度的100%无效
时间: 2023-07-13 14:21:09 浏览: 125
iframe解决高度的终极代码
3星 · 编辑精心推荐
如果您在使用 `<iframe>` 标签时设置了高度为 100%,但是发现它并没有生效,可能是因为它的父元素没有设置高度。在这种情况下,`<iframe>` 的高度将会自动调整以适应其内容的高度,而不是适应父元素的高度。
解决这个问题的方法是,在父元素中设置一个明确的高度,例如使用像素或百分比来设置高度。如果您希望 `<iframe>` 自适应父元素的高度,可以使用 JavaScript 来实现这一点。例如,您可以使用以下代码来设置 `<iframe>` 的高度等于其父元素的高度:
```javascript
var iframe = document.querySelector('iframe');
iframe.style.height = iframe.parentElement.offsetHeight + 'px';
```
这会将 `<iframe>` 的高度设置为其父元素的高度,并使用像素单位进行设置。请注意,在使用此方法时,需要确保父元素已经加载完毕,否则可能会出现高度不正确的情况。
阅读全文