标签：background 自定义 滚动条 scrollbar 设置 10px webkit
1.滚动条的设置，如果想要实现下面这个滚动效果
2.css样式如下：
::-webkit-scrollbar { //设置滚动条的宽高
width: 10px;
height: 10px;
background: transparent;
overflow: visible;
}
::-webkit-scrollbar-button:vertical:single-button:start { //设置滚动条的按钮，这里是设置上图的1
width: 10px;
height: 10px;
display: block;
background-color: #d23d47;
background-image: url(img/uparrow.png); //这里是自己找的上三角型图片，可以去阿里巴巴矢量图标库查找
background-size: 100% 100%;
}
::-webkit-scrollbar-button:vertical:single-button:end { //设置滚动条的按钮，这里是设置上图的3
width: 10px;
height: 10px;
display: block;
background-color: #d23d47;
background-image: url(img/downarraw.png);//这里是自己找的下三角型图片，可以去阿里巴巴矢量图标库查找
background-size: 100% 100%;
}
::-webkit-scrollbar-thumb {// 设置滚动条上的滚动滑块，这里是设置上图的2
background: white;
background: #ff6600;
overflow: visible;
border-radius: 100px;
}
::-webkit-scrollbar-track {// 设置滚动条轨道，这里是设置上图的4
background: #c53d45;
margin-top: 0.1em;
margin-bottom: 0.1em;
}
eg:
<div style="height: 100px;width: 100px;overflow-y: auto;">周恩来（1898年3月5日-1976年1月8日） ，字翔宇，曾用名飞飞、伍豪、少山、冠生等 [1] [6] ，原籍浙江绍兴，1898年3月5日生于江苏淮安。1921年加入中国共产党，是伟大的马克思主义者，伟大的无产阶级革命家、政治家、军事家、外交家，党和国家主要领导人之一，中国人民解放军主要创建人之一，中华人民共和国的开国元勋，是以毛泽东同志为核心的党的第一代中央领导集体的重要成员 [2] 。
1976年1月8日在北京逝世。他的逝世受到极广泛的悼念。由于他一贯勤奋工作，严于律己，关心群众，被称为“人民的好总理”。他的主要著作收入《周恩来选集》。</div>
标签：background,自定义,滚动条,scrollbar,设置,10px,webkit 来源： https://blog.csdn.net/lm13420109892/article/details/117949174
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。