改变复选框显示样式

改变复选框显示样式

HTML如下

<label><input type="checkbox" value="1">保持登录</label>

CSS如下
input[type="checkbox"]{ -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; -o-appearance:none; appearance:none; width:12px; height:12px; border:#b1b1b1 solid 1px; border-radius:10px; margin-right:7px;}
input[type="checkbox"]:checked{border:#f00 solid 1px; position:relative;}
input[type="checkbox"]:checked:before{ content:attr(x); display:block; width:4px; height:4px; border-radius:5px; background:#ff5d29; position:absolute; left:3px; top:3px;}