element-ui滑块样式怎么调，才能变成一下样式？

使用了element-ui表格。滑块样式怎么调才能是一下这样滑动条滑块

<el-slider
      class="sliderMain"
      v-model="value"
      vertical
      height="200px">
    </el-slider>
<style lang="scss">
.sliderMain{
  .el-slider__runway{
    background: #ccc;
  }
  .el-slider__bar{
    background: #000;
  }
  .el-slider__button{
    background:url(../../assets/images/icon_user.png) no-repeat center;//换成你想换的图片
    background-size: contain;
    border:none;
  }
}
</style>

你可以用f12查看element滑块的样式，设置滑动条的长宽和滑块的样式，需要用/deep/传透一下