el-progress 怎么修改样式

Question

 <el-progress :text-inside="true" :stroke-width="15" :percentage="50"></el-progress>

ui样式

怎么达到ui样式效果

Answer 1

颜色自己调一下

<div class="progress">
      <el-progress :text-inside="true" :stroke-width="15" :percentage="50"></el-progress>
    </div>
<style lang="scss">
.progress{
  .el-progress-bar__outer{
    background: #f00!important;
    overflow: initial;
  }
  .el-progress-bar__inner{
    background: transparent!important;
  }
  .el-progress-bar__innerText{
    width:100px;
    height:50px;
    background: #ff0;
    color:#000;
    text-align: center;
    margin-top:-20px;
    line-height: 50px;
  }
}
</style>