新西兰服务器

CSS怎么修改默认滚动条样式


CSS怎么修改默认滚动条样式

发布时间:2022-03-12 19:04:37 来源:高防服务器网 阅读:58 作者:小新 栏目:web开发

小编给大家分享一下CSS怎么修改默认滚动条样式,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

  代码如下:

<divclass="inner">       <divclass="innerbox">       <pstyle="height:200px;">这是内容111</p>       <pstyle="height:400px;">这里是内容222</p>       <p>这里是内容333</p>       </div>       </div>              .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:"5FAE8F6F96C59ED1",Helvetica,"黑体",Arial,Tahoma;       height:100%;       }/*滚动条样式*/       .innerbox::-webkit-scrollbar{/*滚动条整体样式*/       width:4px;/*高宽分别对应横竖滚动条的尺寸*/       height:4px;       }       .innerbox::-webkit-scrollbar-thumb{/*滚动条里面小方块*/       border-radius:5px;       -webkit-box-shadow:inset005pxrgba(0,0,0,0.2);       background:rgba(0,0,0,0.2);       }       .innerbox::-webkit-scrollbar-track{/*滚动条里面轨道*/       -webkit-box-shadow:inset005pxrgba(0,0,0,0.2);       border-radius:0;       background:rgba(0,0,0,0.1);       }

以上是“CSS怎么修改默认滚动条样式”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注高防服务器网行业资讯频道!

[微信提示:高防服务器能助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。

[图文来源于网络,不代表本站立场,如有侵权,请联系高防服务器网删除]
[