小程序修改checkbox的默认样式

微信小程序有提供CSS选择器供开发者编辑checkbox的样式，如下：

未选中的背景样式：wx-checkbox-input
选中后的背景样式 ： wx-checkbox-input.wx-checkbox-input-checked
选中后的勾子的样式：wx-checkbox-input.wx-checkbox-input-checked::before

一、使用uniapp开发的小程序：修改checkbox的默认样式，以及修改禁用后的样式

编写checkbox的css，这个样式必须写在项目的App.vue文件里，如果怕影响了其他页面，可以在checkbox的样式前添加唯一的类名或id：
app.vue文件：

二、使用原生开发的小程序：修改checkbox的默认样式

修改原生checkbox的默认样式并不需要将样式写在类似上文提及的App.vue这样的全局文件中，只需要将样式写在checkbox所在页面对应的 .wxss 文件中即可。

/* 未选中的背景样式 */
checkbox .wx-checkbox-input{
  width: 40rpx; 
  height: 40rpx; 
  border-radius: 50%;
}

/* 选中后的背景样式 */
checkbox .wx-checkbox-input.wx-checkbox-input-checked{
  border-color: #37C674;
  background-color: #37C674;
}

/* 选中后的勾子样式 */
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
  width: 40rpx;
  height: 40rpx;
  line-height: 40rpx;
  border-radius: 50%;
  text-align: center;
  font-size:32rpx; 
  color:#FFF; 
  background: transparent;
  transform:translate(-50%, -50%) scale(1);
  -webkit-transform:translate(-50%, -50%) scale(1);
}