滾動條樣式優化
阿新 • • 發佈:2021-01-19
/* 滾動條樣式 */ /*修改滾動條樣式*/ div::-webkit-scrollbar{ width:10px; height:10px; /**/ } div::-webkit-scrollbar-track{ background: rgb(239, 239, 239); border-radius:2px; } div::-webkit-scrollbar-thumb{ background: #bfbfbf; border-radius:10px; } div::-webkit-scrollbar-thumb:hover{ background: #333; } div::-webkit-scrollbar-corner{ background: #179a16; } /* ::-webkit-scrollbar 滾動條整體部分 ::-webkit-scrollbar-thumb 滾動條裡面的小方塊,能向上向下移動(或往左往右移動,取決於是垂直滾動條還是水平滾動條) ::-webkit-scrollbar-track 滾動條的軌道(裡面裝有Thumb) ::-webkit-scrollbar-button 滾動條的軌道的兩端按鈕,允許通過點選微調小方塊的位置。 ::-webkit-scrollbar-track-piece 內層軌道,滾動條中間部分(除去) ::-webkit-scrollbar-corner 邊角,即兩個滾動條的交匯處 ::-webkit-resizer 兩個滾動條的交匯處上用於通過拖動調整元素大小的小控制元件*/