css重置浏览器滚动条

以下为scss写法

::-webkit-scrollbar { // 宽高
  width: 8px;  
  height: 8px;
  &-track {  // 定义滚动条轨道 内阴影+圆角
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background: transparent;
  }
  &-thumb { // 定义滑块 内阴影+圆角
    $color: rgba(0, 0, 0, 0.15);
    $color-hover: rgba(8, 6, 6, 0.2);
    border-radius: 4px;
    background: $color;
    border: 1px solid rgba(255, 255, 255, 0.4);
    &:window-inactive {
      background-color: $color-hover;
    }
    &:vertical:hover { // hover
      background-color: $color-hover;
    }
    &:vertical:active { // window滚动
      background-color: $color-hover;
    }
  }
}

普通css使用的话，将变量$color $color-hover替换成颜色值， 如需less写法，将$ 换成@即可，