滚动条

作者: kelly_0416 | 来源:发表于2021-12-03 15:44 被阅读0次

    1.IOS 手机容器滚动条滑动不流畅

    overflow:auto;
    
    -webkit-overflow-scrolling:touch;
    

    2.修改滚动条样式

    隐藏div元素的滚动条

    div::-webkit-scrollbar{
          display: none;
    }
    
    div::-webkit-scrollbar滚动条整体部分
    
    div::-webkit-scrollbar-thumb滚动条里面的小方块,能向上向下移动(或往左往右移动,取决于是垂直滚动条还是水平滚动条
    
    div::-webkit-scrollbar-track滚动条的轨道(里面装有Thumb
    
    div::-webkit-scrollbar-button滚动条的轨道的两端按钮,允许通过点击微调小方块的位置
    
    div::-webkit-scrollbar-track-piece内层轨道,滚动条中间部分(除去
    
    div::-webkit-scrollbar-corner边角,即两个滚动条的交汇处
    
    div::-webkit-resizer两个滚动条的交汇处上用于通过拖动调整元素大小的小控件注意此方案有兼容性问题,一般需要隐藏滚动条时我都是用一个色块通过定位盖上去,或者将子级元素调大,父级元素使用overflow-hidden截掉滚动条部分。暴力且直接。
    

    相关文章

      网友评论

          本文标题:滚动条

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