设置I帧的宽度和高度为100％按页面大小不工作

我曾尝试下面的代码。但它没有正确显示iframe。 Iframe的高度和宽度非常小。 Iframe应该根据页面大小获取高度和宽度。设置I帧的宽度和高度为100％按页面大小不工作

<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>

来源

2013-05-16 user2323308

你需要对你的html和body标签100％高度也或对IFRAME – Pete

我的身体和div标签的高度和宽度设置为100％的父标签中的一个设定高度。它仍然没有以正确的方式显示出来。 – user2323308

有多大你想要的iframe - 如果你给特定维度以'＃right'那么你的iframe会占用宽度和高度。 – Pete

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

相对高度和宽度总是指相对于父元素，所以得到母体的具体高度和宽度。

来源

2013-05-16 13:13:14 bouscher

我将body和div标签的高度和宽度设置为100％。它仍然没有以正确的方式显示出来。我不想给高度和宽度px – user2323308

这是你在找什么：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-16 13:15:45 Timidfriendly

我试着上面的代码。 iframe正在采取整页的高度，它只能在铬中工作，但在IE和Firefox的高度很小，另一个查询，为什么iframe没有把页面的剩余空间作为宽度。 – user2323308

再看一次。我认为这是你需要的不是吗？ – Timidfriendly

设置I帧的宽度和高度为100％按页面大小不工作

回答

相关问题