浏览器滚动条默认样式修改

2019-08-14 09:57:38来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

效果如下

 

直接贴代码了

.sidebar {
    z-index: 1024;
    position: fixed;
    left: 0;
    top: 64px;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #001529;
  }
  .sidebar::-webkit-scrollbar-track { /* 定义滚动条轨道  内阴影+圆角*/
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    background-color: #f5f5f5;
  }

  .sidebar::-webkit-scrollbar { /*滚动条整体样式*/
    width: 10px;
    background-color: #f5f5f5;
    border-radius: 5px;
  }

  .sidebar::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #555;
  }

原文链接:https://www.cnblogs.com/thinkguo/p/11310724.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:vue项目中兼容ie8以上浏览器的配置

下一篇:swiper 轮播中常用的效果,持续更新