浏览器忽略css高度和宽度

Question

我正在尝试制作一个 iframe，它将显示带有顶部 div 的外部网站的完整页面。问题是所有浏览器都忽略了宽度和高度 css。 这就是我的 CSS

iframe {
position:fixed;  
width:100%; 
height:100%; 
border:none; 
margin:0; 
padding:0; 
overflow:hidden; 
z-index:999999;}

当您查看site 时，它会忽略使 iframe 无法全屏显示的宽度和高度。当我在浏览器中查看源代码时，缺少宽度和高度。有什么解决办法吗？

Answer 1

您可以为此使用 vh 和 vw 套件。 1vw 是视口宽度的 1%，1vh 是视口高度的 1%：

iframe {
position:fixed;  
width:100vw; 
height:100vh; 
border:none; 
margin:0; 
padding:0; 
overflow:hidden; 
z-index:999999;
}

顺便说一句，我通过链接查看了该网站。它的 iframe 样式有点破：

iframe {
    position: fixed;
    width: 100;
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    z-index: 999999;
}

宽度值没有单位，高度没有。

以下代码有效：

iframe {
    position: fixed;
    width: 100%;
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    z-index: 999999;
    height: 100%;
}