滚动条设置

.table__body {
	/*滚动条整体样式设置*/
  &::-webkit-scrollbar {
    background: #176993;
    width: 10px;
  }
  /*定义内层滚动槽样式*/
  &::-webkit-scrollbar-track-piece{
      background: #176993 !important;
    }
    /*定义两端按钮样式*/
  &::-webkit-scrollbar-button {
    height: 12px;
    border-top: 1px solid #dfdfdf;
    border-right: 1px solid #666666;
    border-bottom: 1px solid #666666;
    border-left: 1px solid #dfdfdf;
    background: rgba(51, 255, 255, 0.5);
    /*按钮处于活跃状态的样式*/
    &:active {
      background: #33ffff;
    }
  }
  /*定义滚动条的轨道样式*/
  &::-webkit-scrollbar-track {
    background: #176993;
  }
  /*定义滑块样式*/
  &::-webkit-scrollbar-thumb {
    background: rgba(51, 255, 255, 0.5);
  }
  /*滑块处于活跃状态的样式*/
  &:active::-webkit-scrollbar-thumb {
    background: #33ffff;
  }
}

效果如下：

滚动条活跃状态如下：