开发者学堂课程【移动 Web 前端开发：分类页-占满剩余的高度】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/594/detail/8430
分类页-占满剩余的高度
一、范例
目前是一个全屏的容器，上下两个模块应该占满全屏，那么下面的容器如何占满剩余的高度。
/*主体容器*/
.jd_main{
Width:100%;
Heigt:100%;
}
如果使用以上的方法，上面的模块占 45px，下面的占 480 px，多出一块。并没有占满剩余的高度，正确的应该使下面容器的高度是 435px。方法如下
.jd_topBar{
width:100%;
height:45px;
border-bottom:1px solid #ddd;
background: url("../images/header-bg.png") repeat-x;
background-size:1px 44px;
position:absolute
left:0
top:0
}
/*主体容器*/
.jd_main
width：100%;
height:100%; I
padding-top:45px;
}
左侧分类和右侧分类具备的特点是左边不变，右边自适应。除了使用 padding 还有另外的方法实现两栏自适应。具体方法见下节。
