我们可以将IFrame的高度和宽度设置为%
我有一个asp.net web应用程序，我有一个标题，下面是一个IFrame （宽度：100%高度：这里100%宽度工作高度不起作用）如果我用%标注尺寸，它不起作用，但如果我用px或pt或任何东西标注固定尺寸，它起作用。。。 有没有办法将高度和宽度设置为%我们可以将IFrame的高度和宽度设置为%,iframe,Iframe,我有一个asp.net web应用程序，我有一个标题，下面是一个IFrame （宽度：100%高度：这里100%宽度工作高度不起作用）如果我用%标注尺寸，它不起作用，但如果我用px或pt或任何东西标注固定尺寸，它起作用。。。 有没有办法将高度和宽度设置为% <%@ Page Language="C#" AutoEventWireup="true" CodeFile="iframeimplementation.aspx.cs" Inherits="iframeimplementat
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="iframeimplementation.aspx.cs"
Inherits="iframeimplementation" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
#top
{
width: 100%;
height: 100%;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
vertical-align: top;
border: 0px;
background-color: Black;
background-color: transparent;
}
#Covenantmenu
{
width: 100%;
font-size: 90%;
}
#Covenantmenu:after
{
/*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#Covenantmenu ul
{
border: 0px solid #BBB;
width: 100%;
background: url(Images/MenuTop.png) repeat-x;
padding: 5px 0;
margin: 0;
text-align: right;
vertical-align: middle;
}
#Covenantmenu ul li
{
display: inline;
}
#Covenantmenu ul li a
{
color: White;
padding: 5px;
margin: 1;
text-decoration: none;
border-right-width: thin;
border-right-color: Gray;
border-right-style: inset;
}
#Covenantmenu ul li a:hover
{
color: Black;
background: url(Images/MenuHover.png) repeat-x;
}
#Gradianbar
{
width: 100%;
font-size: 90%;
}
#Gradianbar ul
{
border: 0px solid #BBB;
width: 100%;
background: url(Images/Mainback1.png) repeat-x;
padding: 5px 0;
margin: 0;
text-align: right;
vertical-align: middle;
height: 1px;
}
.Grid
{
position: relative;
height: 100%;
width: 100%;
font-size: smaller;
font-family: Arial;
font-style: normal;
font-weight: normal;
top: 0px;
left: 0px;
text-align: center;
}
#I1
{
height: 100%;
}
iframe
{
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<form id="form2" runat="server">
<div style="background-image: url('Images/MainBack.png'); background-repeat: repeat">
<table border="0">
<tr>
<td colspan="2">
<div id="Div1">
<div>
<asp:Image ID="Image4" Width="100%" ImageUrl="~/Images/Head_Banner.png" runat="server" />
</div>
<div id="Div2">
<ul>
<li><a href="">Inspection</a></li>
<li><a href="">Reports</a></li>
<li><a href="">Help Desk</a></li>
<li><a href="">User Configuration</a></li>
<li><a href="">System Configuration</a></li>
</ul>
</div>
<div id="Div3">
<ul>
</ul>
</div>
</div>
</td>
</tr>
<tr style="background-image: url('Images/MainBack.png'); background-repeat: repeat">
<td width="15%">
<div style="width: 90%; height: 100%; background-image: url('Images/MainBack.png');"
align="center">
<div style="margin: 0px auto;">
<asp:Panel ID="Panel4" runat="server" Height="100%" Width="90%" HorizontalAlign="Center">
<asp:Image ID="Image5" ImageUrl="~/Images/PanelTop.png" Width="100%" Height="40px"
runat="server" />
<asp:DetailsView ID="DetailsView4" RowStyle-Wrap="true" runat="server" CssClass="Grid"
BackColor="White" GridLines="None">
</asp:DetailsView>
</asp:Panel>
</div>
<br />
<br />
<div style="width: 100%; height: 100%; margin: 0px auto;">
<asp:Panel ID="Panel5" runat="server" Height="100%" Width="90%">
<asp:Image ID="Image6" ImageUrl="~/Images/PanelTop.png" Width="100%" Height="40px"
runat="server" />
<asp:DetailsView ID="DetailsView5" RowStyle-Wrap="true" runat="server" CssClass="Grid"
BackColor="White" GridLines="None">
</asp:DetailsView>
</asp:Panel>
</div>
<br />
<br />
<div style="width: 100%; height: 100%; margin: 0px auto;">
<asp:Panel ID="Panel6" runat="server" Height="100%" Width="90%">
<asp:Image ID="Image7" ImageUrl="~/Images/PanelTop.png" Width="100%" Height="40px"
runat="server" />
<asp:DetailsView ID="DetailsView6" RowStyle-Wrap="true" runat="server" CssClass="Grid"
BackColor="White" GridLines="None">
</asp:DetailsView>
</asp:Panel>
</div>
</div>
</td>
<td width="85%" valign="top" align="left">
<iframe id="Iframe1" src="AdvancedSearch.aspx" runat="server" scrolling="no"></iframe>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
#顶
{
宽度：100%；
身高：100%；
保证金：0px 0px 0px 0px；
填充：0px 0px 0px 0px；
垂直对齐：顶部；
边界：0px；
背景色：黑色；
背景色：透明；
}
#契约菜单
{
宽度：100%；
字体大小：90%；
}
#契约菜单：之后
{
/*在Firefox的菜单和其他内容之间添加边距*/
内容：“.”；
显示：块；
身高：0；
明确：两者皆有；
可见性：隐藏；
}
#契约菜单
{
边框：0px实心#BBB；
宽度：100%；
背景：url（Images/MenuTop.png）repeat-x；
填充：5px0；
保证金：0；
文本对齐：右对齐；
垂直对齐：中间对齐；
}
#立约
{
显示：内联；
}
#立约人
{
颜色：白色；
填充物：5px；
保证金：1；
文字装饰：无；
右边框宽度：薄；
右边框颜色：灰色；
右边框样式：插图；
}
#契约a：悬停
{
颜色：黑色；
背景：url（Images/MenuHover.png）repeat-x；
}
#梯度尺
{
宽度：100%；
字体大小：90%；
}
#拉迪安巴尔酒店
{
边框：0px实心#BBB；
宽度：100%；
背景：url（Images/Mainback1.png）repeat-x；
填充：5px0；
保证金：0；
文本对齐：右对齐；
垂直对齐：中间对齐；
高度：1px；
}
.电网
{
位置：相对位置；
身高：100%；
宽度：100%；
字体大小：较小；
字体系列：Arial；
字体风格：普通；
字体大小：正常；
顶部：0px；
左：0px；
文本对齐：居中；
}
#I1
{
身高：100%；
}
iframe
{
宽度：100%；
身高：100%；
}
<style>
iframe{
height: 50%;
width: 50%;
}
</style>
<iframe src="http://google.com"></iframe>
iframe{
身高：50%；
宽度：50%；
}
宽度正常，但高度不正常，它只是带有一个滚动条。@NiranjanThangaiya油井高度似乎也正常-更改为
80%