大家好,欢迎来到IT知识分享网。
写后台项目,侧边栏和内容主体部分单独有自己的滚动区域–就是自己在自己的区域玩
所以需要给侧边栏和内容主体添加自己的滚动条
需要一个外层盒子,滚动条才能根据内容滚动
<div class="scrollbox">
内容部分
</div>
//用的less写的
<style>
.scrollbox {
height: 100%;
width: 100%;
overflow: auto;
// 滚动条整体部分
&::-webkit-scrollbar{
width: 6px;//对垂直方向滚动条
height: 6px;//对水平方向滚动条
}
//滚动的滑块
&::-webkit-scrollbar-thumb{
border-radius:3px;
background-color: #ccc//滚动条的颜色
}
//内层滚动槽
&::-webkit-scrollbar-track-piece{
background-color:#ccc ;
}
}
</style>
最后的效果-简易版滚动条
下面整理了滚动条常会设置的属性-可以收藏哦
滚动条整体部分 ,设置水平滚动条的高,垂直滚动条的宽.. ::-webkit-scrollbar
滚动的滑块,设置滚动条的颜色,圆角.. ::-webkit-scrollbar-thumb
内层滚动槽,设置滚动条的颜色,宽度.. ::-webkit-scrollbar-track-piece
外层轨道 ::-webkit-scrollbar-track
边角,滚动条的交汇处 ::-webkit-scrollbar-corner
滚动条两端的按钮,允许通过点击微调小方块的位置.. ::-webkit-scrollbar-button
其他的就要自己去发现了~
免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://yundeesoft.com/22131.html