isScroll的滚动组件的用法

Posted 2021-01-11 huanhuan55

<div class="wrapper">
  <ul>
     <li>1</li>
     <li>2</li>
      <li>3</li>
  </ul>
</div>

 

.wrapper{
position:relative; //这个属性必须写，可以为relative或absolute。原因见js部分
margin:50px auto; //上下50px的margin, 水平居中
height:650px; //必须设定scrollbar容器的高度，只有当内容高度超过容器高度的时候，才会显示scrollbar
width:200px;
overflow:hidden; //当父容器高度不足时，只有通过滚动条才能看到超出的内容
background:#eee;
}
ul{
margin:0;
padding:0; //去掉ul默认的样式
list-style:none;
}

ul li{
border:1px solid #ccc;
height:50px;//所有的li高度加起来超过650px，即容器的高度时候，才会出现滚动条
width:100%;
}

详情：https://www.cnblogs.com/yingge/p/5737994.html