我们开发中时常会遇到弹框,内容过长我们就需要自己设置滚动条,本身的滚动条很丑,这样我们可以自己重写一个自己满意的滚动条
如果很多页面需要使用我们可以写一个公共方法,页面直接使用就好
/** 滚动条样式修改*/
.scroll-bar::-webkit-scrollbar {
/*滚动条整体样式*/
width: 5px;
// width: 10px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 5px;
}
.scroll-bar::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 10px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #535353;
}
.scroll-bar::-webkit-scrollbar-track {
/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 10px;
background: #ededed;
}
/** 滚动条样式修改*/
需要什么样的颜色,可以在里面设置什么颜色,然后全局引用此样式文件
在页面里面直接使用: