上下定高 中间自适应_移动端布局上下固定中间自适应

第五步：完整代码

百度经验

*{

margin: 0;

padding: 0;

}

html,body{height:100%;}

body{

font-family: 微软雅黑;

background-color: #f4f4f4;

}

.demon{

display: flex;

flex-direction:column;

height: 100%;

}

.fixed{

width: 100%;

line-height: 45px;

font-size: 16px;

background-color: #0088ee;

color: #fff;

text-align: center;

position: fixed;

}

.fixTop{

top: 0px;

}

.fixBottom{

bottom: 0px;

}

.container2{

flex:1;

margin: 55px 10px ;

background-color: #fff;

overflow: scroll;

}

顶部文字

hahaha

底部文字