支持-webkit-前缀的浏览器,滚动栏有五个css修饰:
整体部分, ::-webkit-scrollbar
两端按钮, ::-webkit-scrollbar-button
外层轨道, ::-webkit-scrollbar-track
内层轨道, ::-webkit-scrollbar-track-piece
滚动滑块, ::-webkit-scrollbar-thumb
边角, ::-webkit-scrollbar-corner
::-webkit-scrollbar{
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track{
background: rgba(0, 0, 0, 0.1);
}
::-webkit-scrollbar-thumb{
background: rgba(0, 0, 0, .3);
}
::-webkit-scrollbar-thumb:hover{
background: rgba(0, 0, 0, 0.4);
}
该方法是直接修改浏览器内置滚动条样式,全局设置,测试兼容浏览器除了ie和firefox其他浏览器都可以用