强力覆盖uniapp中checkbox样式

方法一：

1.修改样式代码必须写在App.vue中，否则样式不生效

/* 复选框 */
	/* 复选框-圆角 */
	uni-checkbox .uni-checkbox-input {
		border-radius: 80rpx !important;
	}

	/* 复选框-背景颜色 */
	uni-checkbox.checked .uni-checkbox-input {
		background-color: #347CED !important;
		border-color: #347CED !important;
	}

2.样式transform: scale(0.7);等比缩放复选框和对号大小

<template>
	<view>
		<view class="text-center">
			<label class="padding-right-xs">
				<checkbox-group >
					<checkbox  class="blue size" style="transform: scale(0.7);" />
					<text class="text-gray" style="vertical-align: middle;">
						同意<text class="text-blue">《老人、儿童托管事宜须知》</text>并遵守
					</text>
				</checkbox-group>
			</label>
		</view>
	</view>
</template>

3.效果

 方法二：

    //必须放在App.vue中
	uni-checkbox .uni-checkbox-input {
		border-radius: 50%;
		border: 1rpx solid rgb(149, 149, 151);
	}
	
	uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked {
		border: 1rpx solid rgb(33, 177, 255);
		background-color: rgb(33, 177, 255);
		
	}
	
	uni-checkbox .uni-checkbox-wrapper {
		width: 100%;
	}
	
	uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before{
		color: #FFFFFF;
	}
	
	uni-checkbox:not([disabled]) .uni-checkbox-input:hover{
		border-color: rgb(33, 177, 255);
	}

<template>
<view class="">
	<checkbox-group class="group" @change="checkChange">
			<label class="list" v-for="(item, index) in fileList" :key="index">
				<view class="name">{{ item.path }}</view>
				<checkbox :value="item.path" class="checkbox" color="#fff"/>
			</label>
	</checkbox-group>
</view>
	
</template>
<script>
	export default {
		data() {
			return {
				
				fileList:[
					{path:'11111'},
					{path:'22222'},
				]
			};
		},
		methods: {
			checkChange(e) {
				console.log(e)
				this.checked = e.detail.value;
			}
		}
	};
</script>
<style>
	
</style>