设置浏览器默认滚动条（谷歌）

/* 设置滚动条的样式 */
::-webkit-scrollbar { width:6px; height:6px;}
/* horizontal 水平方向滚动条两端按钮 */
::-webkit-scrollbar-button:horizontal:decrement{ width:6px; height:6px;border-top: 50px solid transparent;border-right: 100px solid #aeafb1;border-bottom: 50px solid transparent;}/*左侧*/
::-webkit-scrollbar-button:horizontal:increment{ width:6px; height:6px;border-top: 50px solid transparent;border-left: 100px solid #aeafb1;border-bottom: 50px solid transparent;}/*右侧*/
::-webkit-scrollbar-button:horizontal:decrement:hover{border-right: 100px solid #565758;}
::-webkit-scrollbar-button:horizontal:increment:hover{border-left: 100px solid #565758;}
/* vertical 垂直方向滚动条两端按钮*/
::-webkit-scrollbar-button:vertical:decrement{ width:6px; height:6px;border-left: 50px solid transparent; border-right: 50px solid transparent;border-bottom: 100px solid #aeafb1;}/*上方*/
::-webkit-scrollbar-button:vertical:increment{ width:6px; height:6px;border-left: 50px solid transparent;border-right: 50px solid transparent;border-top: 100px solid #aeafb1;}/*下方*/
::-webkit-scrollbar-button:vertical:decrement:hover{border-bottom: 100px solid #565758;}
::-webkit-scrollbar-button:vertical:increment:hover{border-top: 100px solid #565758;}
/* 滚动槽 */
::-webkit-scrollbar-track:horizontal{border-radius: 3px; background: rgba(228,230,232,1); margin:0 5px;} /*水平*/
::-webkit-scrollbar-track:vertical{border-radius: 3px; background: rgba(228,230,232,1); margin:5px 0;} /*垂直*/
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {border-radius: 3px; background: rgba(87,88,89,1);}

 

转载于:https://www.cnblogs.com/dengxiaoqing/p/5139147.html