在html中

 

　　<divclass="box">

 

　　<div>下面内容会单独滚动</div>

 

　　 <divclass="scroll">

 

　　 <divclass="content">

 

　　 <p>1111111111111111</p>

 

　　 <p>222222222222222</p>

 

　　 <p>333333333333333</p>

 

　　 <p>4444444444444444</p>

 

　　 <p>1111111111111111</p>

 

　　 <p>222222222222222</p>

 

　　 <p>333333333333333</p>

 

　　 <p>4444444444444444</p>

 

　　 </div>

 

　　 </div>

 

　　</div>

 

　　css部分

 

　　<style>

 

　　 div{

 

　　 font-size:15px;

 

　　 margin-bottom:20px;

 

　　 }

 

　　 .content{

 

　　 height:300px;v//必须设定滚动部分的高度

 

　　 background-color:cadetblue;

 

　　 color:antiquewhite;

 

　　 overflow-x:hidden;/*x轴禁止滚动*/

 

　　 overflow-y:scroll;/*y轴滚动*/

 

　　 }

 

　　 .content::-webkit-scrollbar{

 

　　 display:none;/*隐藏滚动条*/

 

　　 }

 

　　 p{

 

　　 margin-bottom:30px;

 

　　 font-size:17px;

 

　　 color:#333;

 

　　 }

 

　　</style>