css滚动条样式的设置，直接复制即可

最新推荐文章于 2024-06-20 17:19:07 发布

BiuBiu__A

最新推荐文章于 2024-06-20 17:19:07 发布

阅读量260

点赞数

分类专栏： css 前端文章标签： css css3 前端

本文链接：https://blog.csdn.net/weixin_55195734/article/details/126008027

版权

前端同时被 2 个专栏收录

29 篇文章 0 订阅

订阅专栏

css

3 篇文章 0 订阅

订阅专栏

其中把 .ant-tabs-tabpane替换为自己要更改滚动条样式的类名！效果图！
在这里插入图片描述

    .ant-tabs-tabpane::-webkit-scrollbar {
      /*滚动条整体样式*/
      // width: 19px; /*高宽分别对应横竖滚动条的尺寸*/
      width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
      height: 1px;
    }
    .ant-tabs-tabpane::-webkit-scrollbar-track {
      /*滚动条里面轨道*/
      box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
      background: #ededed;
      border-radius: 10px;
    }
    .ant-tabs-tabpane::-webkit-scrollbar-thumb {
      /*滚动条里面小方块*/
      border-radius: 10px;
      background-color: skyblue;
      background-image: -webkit-linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.2) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.2) 50%,
        rgba(255, 255, 255, 0.2) 75%,
        transparent 75%,
        transparent
      );
    }