如何为框架集中框架内的iframe提供100％的高度

Question

我试过css

iframe {
        margin: 0px;
        padding: 0px;
        width: 100%;
         height:100%; 

    }

我也试过javascript

function resize()
{
    document.getElementById('dashIframe').style.height = top.main.clientHeight + 'px';

}   

但我无法让iframe达到100％的高度

Answer 1

你的iframe占据了父元素的高度。 如果框架中没有其他东西使其变大，则身体的高度为0. 100％的0为0。

你有两个解决方案，要么你的框架的主体和html 100％像这样。

body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

或者给你的iframe绝对定位，确保它不在任何其他具有相对或绝对定位的容器中。 像这样......

iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

另外，HTML5中不再支持框架集。 所以我可能会尝试找到你的框架集的替代解决方案。 您可以使用div实现相同的视觉效果。