自定义复选框

期望效果：

checkbox.jpg

示例代码：
引入JQuery和font-awesome图标

CSS

 .checkbox-style{
        display: inline-block;
        vertical-align: middle;
        text-align: center;
        width: 17px;
        height: 17px;
        line-height: 17px;
        box-sizing: border-box;
        border: 1px solid #a0a0a0;
    }
    .hide{
        display: none;
    }
    .show{
        display: inline-block;
    }

HTML:

  

        
            
            
            会员卡号
        
      

JS: