CSS修改浏览器默认滚动条，增加不贴边修改

ul{
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: center;
}
ul li{
  width: 80px;
  height: 30px;
  line-height: 30px;
  color: #1B1C29;
  font-size: 12px;
}

ul::-webkit-scrollbar {
  /* display: none; */
  width: 16px;
  height: 1px;
}
/*滚动条滑块*/
ul::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 5px solid #fff;
    /* -webkit-box-shadow: 8px 0 0 #E5E5E5 inset;*/
    background: #E5E5E5;
}
/*滚动条轨道*/
ul::-webkit-scrollbar-track {
    /* -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0); */
    border-radius: 6px;
    background: #fff;
}
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容