概述
CSS3自定义滚动条样式
滚动条组成
::-webkit-scrollbar 滚动条整体部分
::-webkit-scrollbar-thumb 滚动条滑块
::-webkit-scrollbar-track 滚动条滑动轨道
::-webkit-scrollbar-button 滚动条两端按钮
::-webkit-scrollbar-track-piect 滚动条整体减去滑块部分
less
.content{
over-flow:auto;
&::-webkit-scrollbar {
width: 4px;
}
&::-webkit-scrollbar-thumb {
border-radius: 15px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: rgba(0, 0, 0, 0.2);
}
&::-webkit-scrollbar-track {
border-radius: 10px;
background: rgba(0, 0, 0, 0.1);
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
}
}
最后
以上就是微笑大白为你收集整理的css3自定义滚动条样式的全部内容，希望文章能够帮你解决css3自定义滚动条样式所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复