微信小程序修改checkbox样式

时间：2024-01-31 09:47:01
/*checkbox 选项框大小  */
.agreement-box checkbox .wx-checkbox-input {
    width: 21rpx;
    height: 21rpx;
}
/*checkbox选中后样式  */
.agreement-box checkbox .wx-checkbox-input.wx-checkbox-input-checked {
    background: #CE2F2F;
}
/*checkbox选中后图标样式  */
.agreement-box checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
    font-size: 22rpx;
    color: #ffffff;
}

　　wxml:

    <view class="agreement-box">
      <checkbox-group bindchange="checkboxChange">
        <checkbox />我已阅读并同意《用户服务协议》
      </checkbox-group>
    </view>

效果：

 

相关文章