修改滚动条样式

修改滚动条样式: 

css:
/*stable-nav为需要显示滚动条的容器*/
.stable-nav {
	/*固定宽度*/
	width: 2.37rem;
	height: 100%;
    position: fixed;
	left: 0;
	top: 0; 
	background: rgba(255,255,255,1);
	/* background-size: 100% 100%; */
	box-shadow: 0rem 0.03rem 0.06rem rgba(223, 230, 235, 0.16);
	overflow-y: auto;
	overflow-x: hidden;
	
}
.stable-nav::-webkit-scrollbar {
	/*滚动条整体样式*/
	width: 4px;
	/*高宽分别对应横竖滚动条的尺寸*/
	height: 4px;
}
 
.stable-nav::-webkit-scrollbar-thumb {
	/*滚动条里面小方块*/
	border-radius: 5px;
	box-shadow: inset 0 0 5px rgba(255, 255, 255, 0.2);
	background: rgba(255, 255, 255, 0.2);
}
 
.stable-nav::-webkit-scrollbar-track {
	/*滚动条里面轨道*/
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
	border-radius: 0;
	background: rgba(0, 0, 0, 0.1);
}

隐藏页面滚动条(页面还是可以继续滚动):

  body::-webkit-scrollbar{
  /*滚动条整体样式*/
  width: 0;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 0;
}