微信小程序修改默认单选，多选按钮样式

微信 小程序 修改 默认 单选，多选 按钮 样式

1.在微信 开发者 文档中复制一份单选或者多选的代码

&lt;!--pages/index3/index.wxml--&gt;
&lt;radio-group bindchange="radioChange"&gt;
        &lt;label class="weui-cell weui-check__label" style="display: flex;"&gt;
            &lt;radio value="1" checked="true"/&gt;
          <view class="weui-cell__bd"&gt;按钮1</view&gt;
        </label>
        <label class="weui-cell weui-check__label" style="display: flex;">
            <radio value="1" checked="true"/>
          <view class="weui-cell__bd">按钮1</view>
        </label>
        <label class="weui-cell weui-check__label" style="display: flex;">
            <radio value="1" checked="true"/>
          <view class="weui-cell__bd">按钮1</view>
        </label>
      </radio-group>

2. 根据情况复制 单选或者多选代码 即可

in de x.wxss

/* pages/index3/index.wxss */
/* 单选按钮样式 */
.wx-radio-input {
    width: 32rpx !important;
    height: 32rpx !important;
    border-radius: 100%;
    background-color: #fff !important;
  }
  /*勾选样式 */
  .wx-radio-input.wx-radio-input-checked {
    border: none !important;
    background-color: #6784f5 !important;
  }

  /* 多选框样式 */

  /* 未勾选样式 */
.wx-checkbox-input {
  width: 33rpx !important;
  height: 33rpx !important;
}
/* 勾选样式 */
.wx-checkbox-input.wx-checkbox-input-checked{
  border-color:#6784f5 !important;
  background:#6784f5 !important;
}