好看的滚动条

 1 /* 滚动条 */
 2 ::-webkit-scrollbar-thumb:horizontal { /*水平滚动条的样式*/
 3     width: 4px;
 4     background-color: #CCCCCC;
 5     -webkit-border-radius: 6px;
 6 }
 7 ::-webkit-scrollbar-track-piece {
 8     background-color: #fff; /*滚动条的背景颜色*/
 9     -webkit-border-radius: 0; /*滚动条的圆角宽度*/
10 }
11 ::-webkit-scrollbar {
12     width: 10px; /*滚动条的宽度*/
13     height: 8px; /*滚动条的高度*/
14 }
15 ::-webkit-scrollbar-thumb:vertical { /*垂直滚动条的样式*/
16     height: 50px;
17     background-color: #999;
18     -webkit-border-radius: 4px;
19     outline: 2px solid #fff;
20     outline-offset: -2px;
21     border: 2px solid #fff;
22 }
23 ::-webkit-scrollbar-thumb:hover { /*滚动条的hover样式*/
24     height: 50px;
25     background-color: #9f9f9f;
26     -webkit-border-radius: 4px;
27 }