直播开发app，css 自定义滚动条样式

直播开发app，css 自定义滚动条样式

<div class="content-wrap">
    <div>
        内容XXXX
    </div>
 
</div>
 
 
<style>
 
// content-wrap样式
.content-wrap {
    flex: 1;
    overflow-y: scroll;
    box-sizing: border-box;
    padding: 0 10px;
    margin: 10px 0;
 
    &.content-wrap {
        /*隐藏滚动条，当IE下溢出，仍然可以滚动*/
        -ms-overflow-style: none;
        /*火狐下隐藏滚动条*/
        overflow: -moz-scrollbars-none;
    }
 
    &.content-wrap::-webkit-scrollbar {
        width: 20px;  // 控制滚动条宽度
        //width: 0;
        height: auto;
    }
 
    &.content-wrap::-webkit-scrollbar-track {
        background: rgb(221, 16, 16); // 控制滚动条背景颜色
        //background: rgb(239, 239, 239)
        border-radius: 4px;
    }
 
    &.content-wrap::-webkit-scrollbar-thumb {
        background: #bfbfbf; // 控制滚动条颜色
        border-radius: 10px;
    }
 
    &.content-wrap::-webkit-scrollbar-thumb:hover { // 鼠标移入滚动条时的颜色变化
        background: #888;
    }
 
    &.content-wrap::-webkit-scrollbar-corner {
        background: #777e77;
    }
}
 
</style>

​以上就是直播开发app，css 自定义滚动条样式， 更多内容欢迎关注之后的文章