checkbox

HTML

<label class="label-checkbox" for="boy">
    <input id="boy" type="checkbox">
    <label for="boy"></label>
    选中
</label>

CSS

.label-checkbox{
	margin-bottom:0;
}
.label-checkbox input{
    width:0;
    visibility:hidden;
}
.label-checkbox label{
    width:15px;
    height:15px;
    cursor:pointer;
    margin-bottom:0;
    border:1px solid #a9a9a9;
    background-color:transparent;
    display:inline-block;
    position:relative;
    vertical-align:middle;
}
.label-checkbox label:after{
    content:'';
    width:9px;
    height:6px;
    top:2px;
    left:2px;
    position:absolute;
    border:2px solid #e60012;
    border-top:none;
    border-right:none;
    -webkit-transform:rotate(-45deg);
       -moz-transform:rotate(-45deg);
            transform:rotate(-45deg);
    opacity:0;
}
.label-checkbox>input:checked+label:after{
    opacity:1;
}