脚本宝典收集整理的这篇文章主要介绍了自定义element-ui的radio选择框样式,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
样式需求:
未完成样式:
问题:选中的radio样式边框未完成,对其进行修改,没有效果
HTML代码:
<div class="form-text"><span>防护区域:</span></div> <div class="form-right"> <el-radio v-model="radio" label="1">A</el-radio> <el-radio v-model="radio" label="2">B</el-radio> <el-radio v-model="radio" label="3">C</el-radio> </div>
CSS代码:
.el-radio{ ::v-deep.el-radio__inner{ width: 30px; height: 30px; border: 2px solid #A7A889; background-color: transparent; &::after{ width: 16px; height: 16px; background: linear-gradient(0deg, #DD2E9B 0%, #F47039 99%); } } ::v-deep.el-radio__label{ font-size: 30px; color: #FFFFFF; } }
以上是脚本宝典为你收集整理的自定义element-ui的radio选择框样式全部内容,希望文章能够帮你解决自定义element-ui的radio选择框样式所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。