用css去自定义页面滚动条的样式(谷歌浏览器,PC端)
常用的自定义滚动条样式,只需要用到三个属性
1.::-webkit-scrollbar
2.::-webkit-scrollbar-track
3.::-webkit-scrollbar-thumb
1. ::-webkit-scrollbar这个属性代表滚动条的整体样式,设置这个之后才能去修改下面的两个属性
::-webkit-scrollbar {width: 6px;border-radius: 3px;}
2.::-webkit-scrollbar-track这个属性代表滚动条的底层样式(即背景)
::-webkit-scrollbar-track {background-color: rgba(0, 20, 26, .3);border-radius: 3px;}
3.::-webkit-scrollbar-thumb这个属性代表滚动条的跟随滚动的小方块
::-webkit-scrollbar-thumb {background-color: #0C85A7;border-radius: 3px;}