<div id="main">
<div id="nav">nav</div> <div id="content">content</div></div>1.浮动特性(浮动元素部分脱离文档流:位置高于常规文档)
#main { background-color: #999; height: 100%;} #nav { background-color: #85d989; width: 100%; height: 50px; float: left;}#content { background-color: #cc85d9; height:100%;}2.绝对定位 (盒模型)
#main { position: relative;
background-color: #999; height: 100%;}#nav {
???background-color: #85d989;
???width: 100%;
???height: 50px;
}
#content {
???background-color: #cc85d9;
???width: 100%;
???position: absolute;
???top: 50px;
???bottom: 0px;
???left: 0px;
}
3.js动态设置剩余高度
获取main、nav高度,相减的content高度
css高度填充剩余空间
原文地址:https://www.cnblogs.com/justSmile2/p/9556618.html