0

我试过以下代码。但它没有以正确的方式显示 iframe。iframe 的高度和宽度非常小。iframe 应根据页面大小采用高度和宽度。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        #left {
            float: left;            
        }

        #right {
            float: left;           
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <div >
            <div id="left">
                <asp:Button runat="server" ID="b1" OnClick="b1_Click" Text="Click" />
            </div>
            <div id="right">
                <iframe id="ifr1" runat="server" style="width: 100%; height: 100%" />
            </div>
        </div>
    </form>
</body>
</html>
4

2 回答 2

2

这是你在找什么：http: //jsfiddle.net/David_Knowles/jFVsr/

html, body {height: 100%; width: 100%; padding: 0; margin: 0; background-color: red;}

编辑：现在 iframe 填满了整个屏幕。

#left {float: left; width: 100%;}
#right {float: left; width: 100%;}
#form1 {background-color: beige; overflow:hidden; height: 100%;}
#ifr1 {border:none; height: 100%;}
于 2013-05-16T13:15:45.110 回答
0

由于您正在浮动元素 #right 并且没有给它任何宽度或高度，因此它将采用其内容的宽度和高度。但是内容也有相对的维度，所以这会崩溃。

相对高度和宽度总是指相对于父元素，所以给父元素一个具体的高度和宽度。

于 2013-05-16T13:13:14.697 回答