专栏首页前端开发随笔Css修改滚动条样式

Css修改滚动条样式

    /* 滚动条整体部分 */
    ::-webkit-scrollbar {
        width: 20px;
        height: 20px;
    }

    /*滚动条轨道、滚动条*/
    ::-webkit-scrollbar-track,
    ::-webkit-scrollbar-thumb {
        border-radius: 50px;
        border: 5px solid transparent;
    }

    /*滚动条轨道*/
    ::-webkit-scrollbar-track {
        box-shadow: 1px 1px 10px #AAAAAA inset;
    }

    /*滚动条*/
    ::-webkit-scrollbar-thumb {
        min-height: 20px;

        background-clip: content-box;
        box-shadow: 0 0 0 5px #088 inset;
    }

    /*边角*/
    ::-webkit-scrollbar-corner {
        background: transparent;
    }

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 微信小程序使用Painter组件生成海报

    任我行RQ
  • Css实现聊天框

    任我行RQ
  • Css制作hover下划线动画

    任我行RQ
  • 用css实现文本溢出 超出部分隐藏显示省略号

    ellipsis  : 溢出显示 ... tip : 设置 ellipsis 时需将给元素设置 overflow: hidden; 和 white-space:...

    德顺
  • CHROME对CSS的解析

    最近完成的一个项目需要做对Chrome的支持,在这个过程中发现了一个Chrome对于Css解析与FF、IE等的区别,在这里总结一下。

    大江小浪
  • 2017移动前端的一些总结web前端 —— 移动端知识的一些总结一.css部分二.js部分

    windseek
  • Sql Server 存储过程中查询数据无法使用 Union(All)

      微软Sql Server数据库中,书写存储过程时,关于查询数据,无法使用Union(All)关联多个查询。

    张传宁老师
  • openCV—访问与操作像素(图片的区域的更改)

    结果如下: 位置(0,0)处的像素 - 红:225,绿:138,蓝:128 位置(0,0)处的像素 - 红:200,绿:150,蓝:100

    bear_fish
  • 关于Python杂七杂八的小东西(搭建Pycharm+Anaconda、删除文档首行小程序、皮尔逊相关系数小程序)

      好久没有回来更新博客了,良心难安啊!最近要做脑电信号的分析,由于导出的数据都是文本格式的,就下定决心放弃Matlab,用Python做分析,确实是挺好用的...

    bear_fish

扫码关注云+社区

领取腾讯云代金券