欢迎来到模板无忧!织梦模板,dede模板下载,织梦cms模板,免费网站模板下载站

模板无忧

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

企业模板

  代码如下:

  <pclass="inner">

  <pclass="innerbox">

  <pstyle="height:200px;">这是内容111</p>

  <pstyle="height:400px;">这里是内容222</p>

  <p>这里是内容333</p>

  </p>

  </p>

  

  .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: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);

  }


希望以上内容可以解决您的问题!
如有其他问题欢迎大家一起交流学习!
作者:酱油妹 来源:www.109f.cn 关注: 时间:2022-05-10 18:00
版权声明:凡注明来源为http://www.nsxcb.cn的均为本站原创,转载请注明来源。
本文网址:http://www.nsxcb.cn/CSS/CSS3/20220510/14146.html
凡本站提供教程均已验证教程的准确性。
相关教程
在线客服

织梦模板 整站模板 新手教程 使用技巧