参考:
支付宝小程序开发——修改小程序原生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>