//适用于谷歌浏览器
.any-scrollbar{
height:100px;
overflow:scroll;
width:100px;
}
//滚动条
.any-scrollbar::-webkit-scrollbar{
width:6px;
height:6px;
}
//滚动条部分
.any-scrollbar::-webkit-scrollbar-thumb{
border-radius:10px;
background-color:rgba(0,0,0,0.1);
}
//滚动条轨道
.any-scrollbar::-webkit-scrollbar-track{
background-color:transparent;
width:6px;
}
//鼠标经过滚动条的变化
.any-scrollbar::-webkit-scrollbar-thumb:hover{
background-color:rgba(0,0,0,0.2);
cursor:pointer;
}
.any-scrollbar::-webkit-scrollbar-track-piece{
width:6px;
background:transparent;
}
.any-scrollbar::-webkit-scrollbar-corner{
background-color:transparent;
}
//火狐浏览器
.any-scrollbar{
scrollbar-color:rgba(0,0,0,0.1);
scrollbar-width:thin;
scrollbar-base-color:rgba(0,0,0,0.1);
scrollbar-track-color:transparent;
scrollbar-highlight-color:transparent;
}
给元素标签设置自定义滚动条
最新推荐文章于 2022-08-19 11:14:21 发布