HTML:
<div class="check-ipt">
<input id="squaredOne1" type="checkbox" name="check" class="none">
<label class="fl" for="squaredOne1"></label>选择1
</div>
CSS:(图形是雪碧图)
.check-ipt input[type=checkbox]+label { margin: 8px 5px -2px 0; background: url(../images/textChecked.png) 0 -26px no-repeat; cursor: pointer; padding-left: 23px; height: 16px; color: #333333; } .check-ipt input[type=checkbox]:checked+label { background: url(../images/textChecked.png) 0 0 no-repeat; color: #298EF8; } .check-ipt input[type=checkbox]:checked+label:hover { background: url(../images/textChecked.png) 0 0 no-repeat; } .check-ipt input[type=checkbox]+label:hover { background: url(../images/textChecked.png) 0 -52px no-repeat; }