element-ui 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;
     }
   }
 }

本网站所收集的部分公开资料来源于AI生成和互联网，转载的目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。