小程序修改默认的单选框复选框样式

/*radio未选中时样式 */ 
radio .wx-radio-input {
  width: 30rpx;
  height: 30rpx;
}


/* 选中后的 背景样式 */
radio .wx-radio-input.wx-radio-input-checked {
  border-color: #25A96D!important;
  background-color: #fff!important;
  width: 30rpx;
  height: 30rpx;
}

/* 选中后的 对勾样式  */
radio .wx-radio-input.wx-radio-input-checked::before {
  /* 去除对号 */
  content: ''; 
  width: 24rpx;
  height: 24rpx;
  border-radius: 50%;
  background-color: #25A96D;
}

修改后展示效果

修改复选框默认样式

.checkbox .wx-checkbox-input {
  border-radius: 32rpx; /* 圆角 */
   32rpx; /* 背景的宽 */
  height: 32rpx; /* 背景的高 */
  border: 2px solid rgba(255, 129, 92, 1);
}

.checkbox .wx-checkbox-input-disabled {
  border-radius: 32rpx; /* 圆角 */
   32rpx; /* 背景的宽 */
  height: 32rpx; /* 背景的高 */
  background: #f3f3f3;
  border: 1px solid rgba(201, 201, 201, 1);
}

.checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  background: rgba(255, 129, 92, 1);
}

.checkbox  .wx-checkbox-input.wx-checkbox-input-checked::before {
   32rpx;
  height: 32rpx;
  line-height: 32rpx;
  text-align: center;
  font-size: 24rpx;
  color: #fff;
  background: transparent;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

.checkbox .wx-checkbox-input {
  border-radius: 32rpx; /* 圆角 */
   32rpx; /* 背景的宽 */
  height: 32rpx; /* 背景的高 */
  border: 1px solid rgba(255, 129, 92, 1);
}

.checkbox .wx-checkbox-input-disabled {
  border-radius: 32rpx; /* 圆角 */
   32rpx; /* 背景的宽 */
  height: 32rpx; /* 背景的高 */
  background: #f3f3f3;
  border: 1px solid rgba(201, 201, 201, 1);
}

.checkbox .wx-checkbox-input.wx-checkbox-input-checked {
  background: rgba(255, 129, 92, 1);
}

.checkbox  .wx-checkbox-input.wx-checkbox-input-checked::before {
   32rpx;
  height: 32rpx;
  line-height: 32rpx;
  text-align: center;
  font-size: 24rpx;
  color: #fff;
  background: transparent;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

原文链接：https://blog.csdn.net/qq_33551792/article/details/89631172