uniapp修改多选框checked、单选框radio颜色以及大小(亲测好用)

 效果

代码

注意:需要写在app.vue里面,如果是uniapp开发的小程序也使用小程序版本

uniapp版本

修改颜色

.uni-checkbox-input-checked,
	.uni-radio-input-checked,
	.uni-switch-input-checked {
		background-color:#5FB878 !important;
		border-color: #5FB878 !important;
		color: #fff !important;
    }
uni-checkbox:not([disabled]) .uni-checkbox-input:hover {
	 border-color: #5FB878;
}

修改大小

.uni-radio-wrapper,
.uni-radio-input{
	width:30rpx;
	height: 26rpx;
	margin: 0;
}

微信小程序版本

修改颜色

.wx-checkbox-input-checked,
.wx-radio-input-checked,
.wx-switch-input-checked {
	background-color: #0099ff !important;
	border-color: #0099ff !important;
	color: #fff !important;
}

修改大小 

.wx-checkbox-input,
.wx-radio-input,
.wx-switch-input {
	border-color: #04BB9C !important;
	width:30rpx;
	height: 30rpx;
}

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值