滚动条常用样式

// Scrollbars
.no-overlay-scrollbar {
  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar:hover {
    height: 8px;
  }

  ::-webkit-scrollbar-button:start:decrement,
  ::-webkit-scrollbar-button:end:increment {
    display: none;
  }
  ::-webkit-scrollbar-button:horizontal:decrement {
    display: none;
  }
  ::-webkit-scrollbar-button:horizontal:increment {
    display: none;
  }
  ::-webkit-scrollbar-button:vertical:decrement {
    display: none;
  }
  ::-webkit-scrollbar-button:vertical:increment {
    display: none;
  }
  ::-webkit-scrollbar-button:horizontal:decrement:active {
    background-image: none;
  }
  ::-webkit-scrollbar-button:horizontal:increment:active {
    background-image: none;
  }
  ::-webkit-scrollbar-button:vertical:decrement:active {
    background-image: none;
  }
  ::-webkit-scrollbar-button:vertical:increment:active {
    background-image: none;
  }
  ::-webkit-scrollbar-track-piece {
    background-color: transparent;
  }

  ::-webkit-scrollbar-thumb:vertical {
    height: 50px;
    background: -webkit-gradient(
      linear,
      left top,
      right top,
      color-stop(0%, $scrollbarBackground),
      color-stop(100%, $scrollbarBackground2)
    );
    border: 1px solid $scrollbarBorder;
    border-top: 1px solid $scrollbarBorder;
    border-left: 1px solid $scrollbarBorder;
  }

  ::-webkit-scrollbar-thumb:horizontal {
    width: 50px;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      color-stop(0%, $scrollbarBackground),
      color-stop(100%, $scrollbarBackground2)
    );
    border: 1px solid $scrollbarBorder;
    border-top: 1px solid $scrollbarBorder;
    border-left: 1px solid $scrollbarBorder;
  }
}