checkbox 用css改变默认的样式

 

 

<!--html-->
<label class="bl_input_checkbox click_checkbox" che_data="10"><input type="checkbox" name="" value=""><i></i><span>有作品</span></label>

 

//css

.bl_input_checkbox i {font-size:12px;font-style:normal;display:inline-block;width:13px;height:13px;text-align:center;line-height:13px;color:#fff;vertical-align:middle;margin:-2px 5px 1px 0px;border:#FF6600 1px solid;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center -3px;
}
.bl_input_checkbox input[type="checkbox"]{display:none;}
.bl_input_checkbox input[type="checkbox"]:checked + i{/*background:#FF6600;*/ background-image: url('../img/duihao_2.png');}

 图片解说：

 

 

来源：https://www.cnblogs.com/zc290987034/p/9322623.html