微信小程序 修改默认单选,多选按钮样式
1.在微信开发者文档中复制一份单选或者多选的代码
<!--pages/index3/index.wxml-->
<radio-group bindchange="radioChange"><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><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. 根据情况复制单选或者多选代码即可
index.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;
}
这样就ok了。
注:仅记录方便开发查找。