更改checkbox的默认样式

样式代码
input[type="checkbox"] {
20px;
height: 20px;
margin: 0;
display: inline-block;
text-align: center;
vertical-align: middle;
line-height: 18px;
margin-right: 10px;
position: relative;
background:#fff;
border:none;
outline: none;
-webkit-appearance:none;
}

input[type="checkbox"]::before {
content: "";
position: absolute;
top: 0;
left: 0;
background: #fff;
100%;
height: 100%;
border: 1px solid #089EFE;
border-radius: 4px;
outline:none;
}

input[type="checkbox"]:checked::before {
content: "2713";
background-color: #089EFE;
position: absolute;
top: 0;
left: 0;
100%;
border: 1px solid #089EFE;
border-radius:4px;
color: #fff;
font-size: 20px;
font-weight: bold;
outline:none;
}