1.滾動條設置為透明（less語法） .scrollbar() {&::-webkit-scrollbar {width: 0.16rem;background-color: transparent;}&::-webkit-scrollbar-track {background-color: transparent;}&::-webkit-scrollbar-thumb {border-radius: 0.08rem;background-color: rgba(255, 255, 255, 0);box-shadow: 0px 1px 3px 0px rgba(44, 47, 49, 0);}/*滾動條的上下兩端的按鈕*/&::-webkit-scrollbar-button {height: 0px;} } 2.設置有顏色的滾動條 &::-webkit-scrollbar {width: 0.16rem;background: rgba(117, 180, 253, 0.2);box-shadow: 0rem 0.01rem 0.01rem 0rem rgba(1, 69, 132, 0.5);border-radius: 0.08rem;} &::-webkit-scrollbar-track {background-color: transparent;}&::-webkit-scrollbar-thumb {border-radius: 0.08rem;background: rgba(138, 191, 253, 1);box-shadow: 0px 1px 3px 0px rgba(44, 47, 49, 0.4); }/*滾動條的上下兩端的按鈕*/&::-webkit-scrollbar-button {height: 0px; }

?

轉載于:https://www.cnblogs.com/hdff/p/10208463.html

總結

以上是生活随笔為你收集整理的修改滚动条的样式的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。