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;
}

你可能感兴趣的:(CSS修改浏览器默认滚动条,增加不贴边修改)