zoukankan      html  css  js  c++  java
  • 移动端设置滚动后显示滚动条

    ::-webkit-scrollbar {
        -webkit-appearance: none;
    }
    
    ::-webkit-scrollbar:vertical {
         12px;
    }
    
    ::-webkit-scrollbar:horizontal {
        height: 12px;
    }
    
    ::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, .5);
        border-radius: 10px;
        border: 2px solid #ffffff;
    }
    
    ::-webkit-scrollbar-track {
        border-radius: 10px;  
        background-color: #ffffff; 
    }
    

      

    ::-webkit-scrollbar 滚动条整体部分

    ::-webkit-scrollbar-thumb  滚动条里面的小方块,能向上向下移动(或往左往右移动,取决于是垂直滚动条还是水平滚动条)

    ::-webkit-scrollbar-track  滚动条的轨道(里面装有Thumb)

    ::-webkit-scrollbar-button 滚动条的轨道的两端按钮,允许通过点击微调小方块的位置。

    ::-webkit-scrollbar-track-piece 内层轨道,滚动条中间部分(除去)

    ::-webkit-scrollbar-corner 边角,即两个滚动条的交汇处

    ::-webkit-resizer 两个滚动条的交汇处上用于通过拖动调整元素大小的小控件

  • 相关阅读:
    js 数组去重的几种方式及原理
    js replace
    gulp的使用方法
    gulp 安装部署
    gulp 的5个方法
    fiddler 监听手机的http请求
    vsCood
    browser-sync使用方法
    browser-sync 安装
    npm 移除第三方包
  • 原文地址:https://www.cnblogs.com/dinghaoran/p/13542151.html
Copyright © 2011-2022 走看看