css修改overflow滚动条默认样式

html代码

这是内容111

这里是内容222

这里是内容333

css代码

    .inner{

            width: 265px;

            height: 400px;

            position: absolute;

            top: 33px;

            left: 13px;

            /*cursor: pointer;*/

            overflow:hidden;

        }

        .innerbox{

            overflow-x: hidden;

            overflow-y: auto;

            color: #000;

            font-size: .7rem;

            font-family: "\5FAE\8F6F\96C5\9ED1",Helvetica,"黑体",Arial,Tahoma;

            height: 100%;

        }

        /*滚动条样式*/

        .innerbox::-webkit-scrollbar {/*滚动条整体样式*/

            width: 4px;    /*高宽分别对应横竖滚动条的尺寸*/

            height: 4px;

        }

        .innerbox::-webkit-scrollbar-thumb {/*滚动条里面小方块*/

            border-radius: 5px;

            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);

            background: rgba(0,0,0,0.2);

        }

        .innerbox::-webkit-scrollbar-track {/*滚动条里面轨道*/

            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);

            border-radius: 0;

            background: rgba(0,0,0,0.1);

        }

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容