微信公众号开发

小程序-修改radio及checkbox的选中背景色

本文主要是介绍小程序-修改radio及checkbox的选中背景色,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

 

 

一:将默认多选框checkbox的默认选中背景红色改为绿色

checkbox .wx-checkbox-input{

  border-radius:50%;

  width:20px;height:20px;

}
checkbox .wx-checkbox-input.wx-checkbox-input-checked{

  border-color:#07c160 !important;

  background:#07c160 !important;

}
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{

  border-radius:50%;

  width:20px;

  height:20px;

  line-height:20px;

  text-align:center;

  font-size:15px;

  color:#fff;

  background:transparent;

  transform:translate(-50%, -50%) scale(1);

  -webkit-transform:translate(-50%, -50%) scale(1);

}

  

 

二:将radio默认选中的红色改为绿色

radio .wx-radio-input{

  border-radius:50%;

  width:20px;

  height:20px;

}
radio .wx-radio-input.wx-radio-input-checked{

  border-color:#07c160 !important;

  background:#07c160 !important;

}
radio .wx-radio-input.wx-radio-input-checked::before{

  border-radius:50%;

  width:20px;

  height:20px;

  line-height:20px;

  text-align:center;

  font-size:15px;

  color:#fff;

  background:transparent;

  transform:translate(-50%, -50%) scale(1);

  -webkit-transform:translate(-50%, -50%) scale(1);

}

  

 

这篇关于小程序-修改radio及checkbox的选中背景色的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!