如何修改浏览器的默认滚动条的样式？

<div class="left-content" ref="newView">
    // 主要的样式结构
</div>

原样式：

 

 

修改后的图片：

 

 

样式调整：

.left-content {
    
  overflow: auto;
}
.resume-wrapper::-webkit-scrollbar,
        /deep/ .resume-wrapper::-webkit-scrollbar {
            width: 10px;
            height: 10px;
        }
        .resume-wrapper::-webkit-scrollbar-track,
        /deep/ .resume-wrapper::-webkit-scrollbar-track {
            background: #eee;
            border-radius: 5px;
        }
        .resume-wrapper::-webkit-scrollbar-thumb,
        /deep/ .resume-wrapper::-webkit-scrollbar-thumb {
            background: #bfbfbf;
            border-radius: 10px;
        }