微信小程序修改radio样式

在开发小程序的时候，使用一些小程序自己提供的组件，感觉有和ul设计的不一样，这样让我们修改很通过，尤其是radio组件，checkbox组件。我们怎么去修改这样的样式。

小城默认样式

• 使用小程序的radio组件

<radio-group name="sex"   class="form-radio_wrap">
                    <label>
                        <radio  value="男" checked="{{sex == '男'}}" />男</label>
                    <label class="form-radio">
                        <radio value="女" checked="{{sex == '女'}}" />女</label>
                </radio-group>

修改样式

.form-group .form-radio_wrap radio .wx-radio-input {
  height: 24rpx;
  width: 24rpx;
  border-radius: 50%;
  border: 2rpx solid #e6c171;
  background: transparent;
}

.form-group .form-radio_wrap radio .wx-radio-input.wx-radio-input-checked::before {
  border-radius: 50%; /* 圆角 */
  width: 18rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
  height: 18rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
  line-height: 18rpx;
  text-align: center;
  font-size: 0rpx; /* 对勾大小 30rpx */
  color: transparent; /* 对勾颜色 白色 */
  background: #e6c171;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}

• 最终呈现效果,然后自己可以在修改细节问题

• 如果是多选框的话，只需要把radio修改成checkbox就行