1.认识滚动条
滚动条
2.设置样式
//整体样式
::-webkit-scrollbar {
width: 25px; //x轴的滚动条大小
height: 25px; //y轴的滚动条大小
}
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
border-radius: 999px;
border: 5px solid transparent;
}
::-webkit-scrollbar-track {
// 轨道样式
display: none;
}
::-webkit-scrollbar-thumb {
//滑块样式
background: rgba(129, 129, 128, 0.3);
background-clip: content-box; //留白
}
::-webkit-scrollbar-corner {
background: transparent;
}
3.效果
效果
