小程序中修改checkbox和radio的样式

在微信小程序里面，有时候为了配合整个项目的风格，checkbox和radio的样式会有些不同。

• 修改checkbox样式

.wxml

    
        
        可用2000个积分币抵扣
    

.wxss
/* checkbox未选中时样式 */

checkbox .wx-checkbox-input{
    border-radius: 3rpx;
    height: 26rpx;
    width: 26rpx;
    margin-top: -4rpx;
    /* 自定义样式.... */
} 

/* checkbox选中时样式 */

checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
  background-color: #e02e24;
  border: 1rpx solid #e02e24;
  /* 自定义样式.... */
}

• 修改radio样式
  .wxml

  
  {{item.value}}
  

.wxss
/* radio未选中时样式 */

radio .wx-radio-input{
  border-radius: 3rpx;
  height: 26rpx;
  width: 26rpx;
  margin-top: -4rpx;
  /* 自定义样式.... */
} 

/* radio选中时样式 */

radio .wx-radio-input.wx-radio-input-checked::before{
  background-color: #e02e24;
  border: 1rpx solid #e02e24;
  /* 自定义样式.... */
}

---

作者：Lucky_Aimee
来源：CSDN
原文：https://blog.csdn.net/qq_39364032/article/details/79742415?utm_source=copy
版权声明：本文为博主原创文章，转载请附上博文链接！