代码
隐藏滚动条
直接使用
hideScrollbar即可
.hideScrollbar::-webkit-scrollbar {
display: none; /* Chrome Safari */ } .hideScrollbar {
scrollbar-width: none; /* firefox */ -ms-overflow-style: none; /* IE 10+ */ overflow-x: hidden; overflow-y: auto; }
美化滚动条
::-webkit-scrollbar {
width: 5px; /* 滚动条宽度 */ height: 10px; } ::-webkit-scrollbar-track {
width: 6px; background: rgba(#101f1c, 0.1); -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } ::-webkit-scrollbar-thumb {
background-color: rgba(144, 147, 153, 0.5); background-clip: padding-box; min-height: 28px; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; transition: background-color 0.3s; cursor: pointer; } ::-webkit-scrollbar-thumb:hover {
background-color: rgba(144, 147, 153, 0.3); }
发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/223462.html原文链接:https://javaforall.net
