css修改input checkBox复选框默认样式，css美化复选框样式

1、原input代码

2、css重写样式代码
注意：input里面一定要加position：relative。不然选中时对号没有效果。

input[type="checkbox"]{
    -webkit-appearance: none;
    vertical-align:middle;
    margin-top:0;
    background:#fff;
    border:#999 solid 1px;
    border-radius: 3px;
    min-height: 16px;
    min-width: 16px;
	position: relative;
	cursor: pointer;
}
input[type="checkbox"]:checked {
    background: #3190e8;
	border: none;
}
input[type=checkbox]:checked::after{
    content: '';
    top: 3px;
    left: 3px;
    position: absolute;
    background: transparent;
    border: #fff solid 2px;
    border-top: none;
    border-right: none;
    height: 6px;
    width: 10px;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); 
    transform: rotate(-45deg);
}

（编写高质量代码，一个专业致力于页面转化，切图的前端爱好者~~）