超美的滾動條樣式

班主任發表於2019-11-27
  • 滾動條樣式直接複製貼上即可
overflow: scroll;

    ::-webkit-scrollbar {
        width: 14px;
        height: 14px;
    }

    ::-webkit-scrollbar-track,
    ::-webkit-scrollbar-thumb {
        border: 5px solid transparent;
        border-radius: 999px;
    }

    ::-webkit-scrollbar-track {
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) inset;
    }

    ::-webkit-scrollbar-thumb {
        min-height: 20px;
        background-clip: content-box;
        box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.2) inset;
    }

    ::-webkit-scrollbar-corner {
        background: transparent;
    }
複製程式碼

相關文章