用css去自定义页面滚动条的样式（谷歌浏览器，PC端）

用css去自定义页面滚动条的样式（谷歌浏览器，PC端）

常用的自定义滚动条样式，只需要用到三个属性

1.::-webkit-scrollbar

2.::-webkit-scrollbar-track

3.::-webkit-scrollbar-thumb

1. ::-webkit-scrollbar这个属性代表滚动条的整体样式，设置这个之后才能去修改下面的两个属性

::-webkit-scrollbar {
      width: 6px;
      border-radius: 3px;
  }

2.::-webkit-scrollbar-track这个属性代表滚动条的底层样式（即背景）

::-webkit-scrollbar-track {
      background-color: rgba(0, 20, 26, .3);
      border-radius: 3px;
  }

3.::-webkit-scrollbar-thumb这个属性代表滚动条的跟随滚动的小方块

::-webkit-scrollbar-thumb {
      background-color: #0C85A7;
      border-radius: 3px;
  }

注意这个适用于谷歌浏览器，其他浏览器本人并未进行测试，有其他问题的小伙伴欢迎留言探讨