uniapp 支付寶小程序 checkbox默認樣式修改

參考：

支付寶小程序開發——修改小程序原生radio默認樣式 - 逍遙雲天 - 博客園 (cnblogs.com)

支付寶小程序的checkbox組件樣式問題-帖子詳情-開放社區 (alipay.com)

(1條消息) 淺談 css的zoom屬性_前端小白-CSDN博客

我的樣式修改代碼：

/* #ifdef MP-ALIPAY  */
checkbox{
  margin:0 20rpx 0 25rpx;
  width: 28rpx;
  height: 28rpx;
  border-radius: 0rpx;
  /* position: absolute; */
  /* top: 15rpx; */
  /* left: 30rpx; */
}

/*checkbox選中后樣式  */
checkbox-checked {
  zoom:0.7;
  border: 2rpx solid #CB1E36;
  background-color: #CB1E36;
  border-radius: 0rpx;
}

/*checkbox選中后圖標樣式  */
//支付寶好像不支持偽類，此樣式不生效
checkbox-checked ::before {
  width: 28rpx;
  height: 28rpx;
  line-height: 28rpx;
  text-align: center;
  font-size: 14rpx;
  color: #FFFFFF;
  background: transparent;
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
}
/* #endif */

上面的代碼只能修改方框大小背景等，對勾的顏色還是得參考文檔直接在組件對color傳參修改

<checkbox :checked="if_checked"  color="#FFFFFF" ></checkbox>