css 美化滚动条

美化滚动条

转载于：https://blog.csdn.net/qq_29715077/article/details/124476440

.story-scroll{
    height: 298px;
    overflow: auto;
    position: relative;
    &::-webkit-scrollbar {
        width: 8px;
        background-color: none;
    }
    &:hover ::-webkit-scrollbar-track-piece {
       background-color: #eee;
        opacity: 0;
        border-radius: 3px;
        transition: all 1s ease 0s;
    }
    
    &:hover::-webkit-scrollbar-thumb:hover {
        transition: all 1s ease 0s;
        opacity: 1;
    }
    &:hover::-webkit-scrollbar-thumb:vertical {
        background-color: #eee;
        border-radius: 3px;
        outline: 2px solid #fff;
        outline-offset: -2px;
        border: 2px solid #fff;
    }
}