小程序checkbox和radio樣式修改

1、沒有修改過的默認（禁用）樣式：

2、 修改默認樣式（大小顏色圓角）

/* 修改默認樣式 */
checkbox .wx-checkbox-input,radio .wx-radio-input {
  border-radius: 50%;
  width: 40rpx; 
  height: 40rpx;
  background: #fff;
}

3、修改checked狀態時的樣式。爲什麼不直接在這裏修改背景色，因爲所有都disabled了，checked的背景色只能修改中間的打鉤的部分。

/* 修改checked樣式 */
radio .wx-radio-input.wx-radio-input-checked::before,
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
 color: #fff;
}

4、修改禁用且checked的樣式：

/* 修改禁用且checked的樣式 */
radio .wx-radio-input.wx-radio-input-checked.wx-radio-input-disabled,
checkbox .wx-checkbox-input.wx-checkbox-input-checked.wx-checkbox-input-disabled {
  background: #ff6633;
  border-color: #ff6633;
  color: #fff;
}

完整代碼：

/* 修改默認樣式 */
checkbox .wx-checkbox-input,radio .wx-radio-input {
  border-radius: 50%; /* 圓角 */
  width: 40rpx; /* 背景的寬 */
  height: 40rpx; /* 背景的高 */
  background: #fff;
}
/* 修改checked樣式 */
radio .wx-radio-input.wx-radio-input-checked::before,
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
 color: #fff;
 background: #ff6633;
}

/* 修改禁用且checked的樣式 */
radio .wx-radio-input.wx-radio-input-checked.wx-radio-input-disabled,
checkbox .wx-checkbox-input.wx-checkbox-input-checked.wx-checkbox-input-disabled {
  background: #ff6633;
  border-color: #ff6633;
  color: #fff;
}