
将下面代码放入项目文件public/index.html的style中即可
修改后样式

将下列代码放入html的style中即可
body::-webkit-scrollbar {
width: 10px;
height: 10px;
}
/*正常情况下滑块的样式*/
body::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.05);
border-radius: 10px;
-webkit-box-shadow: inset1px1px0rgba(0, 0, 0, 0.1);
}
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
body:hover::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2);
border-radius: 10px;
-webkit-box-shadow: inset1px1px0rgba(0, 0, 0, 0.1);
}
/*鼠标悬浮在滑块上时滑块的样式*/
body::-webkit-scrollbar-thumb:hover {
background-color: rgba(0, 0, 0, 0.4);
-webkit-box-shadow: inset1px1px0rgba(0, 0, 0, 0.1);
}
/*正常时候的主干部分*/
body::-webkit-scrollbar-track {
border-radius: 10px;
-webkit-box-shadow: inset006pxrgba(0, 0, 0, 0);
background-color: white;
}
/*鼠标悬浮在滚动条上的主干部分*/
body::-webkit-scrollbar-track:hover {
-webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.4);
background-color: rgba(0, 0, 0, 0.01);
}