微信小程序中修改checkbox的选中样式

近日在做小程序选项框时，发现小程序默认的样式是自带绿色的，在网上也找了各种方法去修改他默认的选中样式。找了多种资料，发现网上的代码样式只能修改单选框的，修改多选框的样式并不起效。

1. 在做单选框时直接用的网上的样式是可以解决的，贴下代码：

radio {

    width: 40rpx;

}

/* 单选框未选中 */

radio .wx-radio-input {

    width: 30rpx;

    height: 30rpx;

    border-radius: 50%;

}

/* 单选框选中后对勾样式 */

radio .wx-radio-input.wx-radio-input-checked::before{

    border-radius: 50%;

    width: 55rpx;

    height: 55rpx;

    line-height: 55rpx;

    text-align: center;

    font-size: 30rpx;   

    color:#fff;

    background-color: #B30000;

    border-color:#B30000;

}

更改后的效果如下：

单选框

2. 多选框：（网上的修改的css样式并不起效，于是去查了官网文档）

看上图，官网文档上已给出了可以绑定color这个属性，于是乎，问题就很好解决了。贴下图解决方法：

首先我们先绑定color属性：

再到data中绑定：

最后 就修改完成了