element-ui steps步骤条自定义颜色

效果图：

页面代码：

<el-steps :active="active"class="stepsStyle"><el-step title="开始"></el-step><el-step title="2"></el-step><el-step title="3"></el-step><el-step title="4"></el-step><el-step title="结束"></el-step></el-steps>

data数据：
data(){return{active:2}},

css代码：

.stepsStyle{width: 100%;::v-deep{.el-step__title.is-process,.el-step__title.is-wait{color: #fff !important;}.el-step__head.is-process,.el-step__heads.is-wait{.el-step__icon.is-text{//这里设置的是下一步和等待状态里的文字颜色
         color: #C0C4CC !important;border-color: #C0C4CC !important;}}.el-step__head.is-finish{color: orange !important;.el-step__icon.is-text{//这里设置的是已完成状态里的文字颜色
         color: orange !important;border-color: orange !important;}}.el-step__title.is-finish{color: orange !important;}.el-step__line-inner{//这里设置的是完成后过渡线条颜色
       border-color: orange !important;}.el-step__head.is-success,.el-step__title.is-success{//这里设置的是完成后的颜色
       color: orange !important;}}}