使用表单验证时，CheckBox 是不可缺少的一部分。

由于浏览器兼容性，checkbox 会显示不同的样式，直接设置 input 的 backgroundColor 属性，不能改变checkbox 的背景颜色和样式。

下面是 Safari 浏览器 PC 端样式 下面是 Chrome 移动端样式 如果是用第三方库（例如 bootstrap），实际上是在原生的 input 上面进行改变，仍然不能解决浏览器兼容性问题。

所以，可以使用自定义的 CheckBox 解决这个问题

下面是自定义的CSS

可以根据实际需求设置背景色了。

然后，需要把默认的勾选框设置成透明，层级设置较高，那么界面点击勾选框就可以改变数据变化了。 如果这里的对勾选项是响应式的，那么根据 value 绑定 input 即可实现。