CSS scrollbar滚动条Firefox/Chrome/Edge
效果如上图支持Firefox, Chrome, Edge
.main_frame
{width:100%;height:100%;overflow-y:scroll;background:url(/pic/bg.png);/*Firefox*/scrollbar-color:#0C6992 #0C6992;/*背景色和前景色*/scrollbar-width:thin;/*实现没有上下箭头*/
}
/*Chrome/Edge*/
.main_frame::-webkit-scrollbar
{width:5px;
}
.main_frame::-webkit-scrollbar-track
{border-radius:25px;-webkit-box-shadow:inset 0 0 5px rgba(0, 0, 0, 0.2);background:rgba(0, 0, 0, 0.2);
}
.main_frame::-webkit-scrollbar-thumb
{border-radius:15px;-webkit-box-shadow:inset 0 0 5px rgba(0, 0, 0, 0.2);background:rgba(0, 0, 0, 0.2);
}