css+div 网页充满整个浏览器窗口
我在设计网页的时候才用三栏式(页首、主体内容、页尾)。网页的高度为未知数,随着主体内容的多少有可能没有上下滑动条。但要求在网页主体内容最少的时候整个网页也能充满这个浏览器...
我在设计网页的时候才用三栏式(页首、主体内容、页尾)。网页的高度为未知数,随着主体内容的多少有可能没有上下滑动条。但要求在网页主体内容最少的时候整个网页也能充满这个浏览器,如下情况,页面content的div就无法充满整个浏览器,而是由于内容较少,聚集到浏览器的上面,实现不了,页尾在浏览器的尾部。
<body style=" background-color:Blue;">
<form id="form1" runat="server">
<div id="content">
<div>
<uc1:Header ID="Header1" runat="server" />
</div>
<div>主体内容</div>
<div>
<uc2:Footer ID="Footer1" runat="server" />
</div>
</div>
</form>
</body>
body style=" background-color:Blue;">
<form id="form1" runat="server">
<div id="content" runat="server">
<div id="header" runat="server">
<uc1:Header ID="Header1" runat="server" />
</div>
<div id="realContent" runat="server">主体内容</div>
<div id="footer" runat="server">
<uc2:Footer ID="Footer1" runat="server" />
</div>
</div>
</form>
</body>
要求其中控件header1和footer1的高度是固定的了,由控件自身的高度决定,因此id为header和footer的div的高度就固定了。唯一变化的就是包含主体内容的id为realContent的div的高度,当realContent中内容很少的情况下,该div的高度就会很小,导致id为content的div无法站面整个浏览器窗口。
因此问题是如何在id为realContent的div内容很少的时候content的div仍能站慢整个窗口。
可是你并不知道别人用的显示器的分辨率啊。固定了宽度,就有可能在不同的分辨率下出现问题。 展开
<body style=" background-color:Blue;">
<form id="form1" runat="server">
<div id="content">
<div>
<uc1:Header ID="Header1" runat="server" />
</div>
<div>主体内容</div>
<div>
<uc2:Footer ID="Footer1" runat="server" />
</div>
</div>
</form>
</body>
body style=" background-color:Blue;">
<form id="form1" runat="server">
<div id="content" runat="server">
<div id="header" runat="server">
<uc1:Header ID="Header1" runat="server" />
</div>
<div id="realContent" runat="server">主体内容</div>
<div id="footer" runat="server">
<uc2:Footer ID="Footer1" runat="server" />
</div>
</div>
</form>
</body>
要求其中控件header1和footer1的高度是固定的了,由控件自身的高度决定,因此id为header和footer的div的高度就固定了。唯一变化的就是包含主体内容的id为realContent的div的高度,当realContent中内容很少的情况下,该div的高度就会很小,导致id为content的div无法站面整个浏览器窗口。
因此问题是如何在id为realContent的div内容很少的时候content的div仍能站慢整个窗口。
可是你并不知道别人用的显示器的分辨率啊。固定了宽度,就有可能在不同的分辨率下出现问题。 展开
4个回答
展开全部
可以在三个DIV的外面再加一个父级的DIV,然后设置这个DIV的高度为100%.
不过直接设置高度为100%对于大多数浏览器无效.一个对象的高度是否可以使用百分比显示,取决于对象的父级对象.
IE中认为父级对象为body
FF等标准浏览器认为为HTML
html,body{
margin:0px;
height:100%;
}
#high{
background-color:#CCCCCC;
border:2px solid #f00;
width:300px;
height:100%;
}
不过直接设置高度为100%对于大多数浏览器无效.一个对象的高度是否可以使用百分比显示,取决于对象的父级对象.
IE中认为父级对象为body
FF等标准浏览器认为为HTML
html,body{
margin:0px;
height:100%;
}
#high{
background-color:#CCCCCC;
border:2px solid #f00;
width:300px;
height:100%;
}
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
把CSS里面content这个ID里面的宽度去掉就可以了.
#content{margin:100px auto}
#content{margin:100px auto}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
要用固定高度定义content,要不就用内容把它撑开,两个都不用怎么会自己变长?
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询