修改浏览器默认滚动条样式-属性自定义

滚动条各个属性说明

::-webkit-scrollbar ：滚动条整体部分，其中的属性有width,height,background,border等。

::-webkit-scrollbar-thumb ：滚动条里面可以拖动的滑块

::-webkit-scrollbar-track ：外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。

::-webkit-scrollbar-track-piece ：内层轨道，需要注意的就是它会覆盖第三个属性的样式。

::-webkit-scrollbar-button ：滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。

::-webkit-scrollbar-corner ：边角，两个滚动条交汇处

::-webkit-resizer ：两个滚动条交汇处用于拖动调整元素大小的小控件（基本用不上）

注意：一般使用前三个即可达到修改滚动条样式，css如下, 各项均可修改：

/*定义滚动条宽高及背景，宽高分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
    width: 10px; /*对垂直滚动条有效*/
    height: 10px;  /*对水平滚动条有效*/
}

/*定义滚动条的轨道颜色、内阴影及圆角*/
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #ececec;
    border-radius: 3px;
}

/*定义滑块颜色、内阴影及圆角*/
::