Css实现滚动条样式代码

admin

撰写于 2021年 01月 25 日

Css实现滚动条样式代码

    <style>
    /*定义滚动条样式（高宽及背景）*/ 
    ::-webkit-scrollbar { 
        width: 6px;   /* 滚动条宽度， width：对应竖滚动条的宽度  height：对应横滚动条的高度*/
        background: #808080;
    } 
    /*定义滚动条轨道（凹槽）样式*/ 
    ::-webkit-scrollbar-track { 
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);    /* 较少使用 */
        border-radius: 3px; 
    } 
    /*定义滑块 样式*/ 
    ::-webkit-scrollbar-thumb { 
        border-radius: 3px; 
        height: 100px;    /* 滚动条滑块长度 */
        background-color: #ccc; 
    }
</style>