上下固定中间滚动条
css：
<style>
body{
margin:0;
}
html{
font-size: 13.3333vw;
}
html,body{
height:100%;
}
header{
height:.6rem;
background-color: red;
}
.main{
background-color: yellowgreen;
height:calc(100% - 1.2rem)
}
footer{
height:.6rem;
background-color: orange;
}
.left{
float:left;
width:2.3rem;
background-color: #fff;
height:100%;
}
.right{
margin-left:2.3rem;
height:100%;
background-color: yellow;
/* 只沿y轴方向溢出 */
overflow-y:auto;
}
.content{
height:4.38rem;
background-color: purple;
margin:.1rem;
}
</style>html：
<body>
<header></header>
<div class="main">
<div class="left"></div>
<div class="right">
<div class="content"></div>
<div class="content"></div>
<div class="content"></div>
<div class="content"></div>
<div class="content"></div>
<div class="content"></div>
<div class="content"></div>
</div>
</div>
<footer></footer>
</body>
