css 修改复选框的样式

效果图：

实现代码如下：

/* 选中input标签类型为复选框的 */
input[type="checkbox"] {
   width: 16px;
   height: 16px;
   vertical-align: middle;
   -webkit-appearance: none;
   /*清除默认样式*/
   border: 1px solid #D1D1D1;
   border-radius: 3px
}
 
/* 点击选中时 */
input[type="checkbox"]:checked {
   background: url("https://pic.imgdb.cn/item/63a01ca8b1fccdcd365fc380.png") no-repeat center center;
   background-size: 20px;
}