美文网首页
scss 封装定制滚动条mixin

scss 封装定制滚动条mixin

作者: mudssky | 来源:发表于2023-01-04 16:58 被阅读0次

    scss 封装定制滚动条mixin

    下面是抄的youtube滚动条的配色

    // 定制滚动条
    @mixin scrollbar-custom(
      $width: 8px,
      $borderRadius: 8px,
      $bgColor: #606060,
      $hoverColor: #909090
    ) {
      // 滚动条定制
      // 整个滚动条
      &::-webkit-scrollbar {
        width: $width;
      }
    
      // 滑块
      &::-webkit-scrollbar-thumb {
        background-color: $bgColor;
        border-radius: $borderRadius;
      }
      &::-webkit-scrollbar-thumb:hover {
        background-color: $hoverColor;
      }
    }
    
    

    相关文章

      网友评论

          本文标题:scss 封装定制滚动条mixin

          本文链接:https://www.haomeiwen.com/subject/noarcdtx.html