标签模拟多选择框checkbox，分享

用label标签模拟checkbox选择框，贴出关键代码如下：（具体样式还需自己调整一下）

我的效果·：

 多个选项框设置一样，改变下input输入框的calss名与label名即可，

HTML代码：    <div class="hander">         <input type="checkbox" name="favorite" value="1" id="color-input-red" class="color-input-red"/>         <label for="color-input-red"></label>         <span>手袋</span>     </div>

 CSS代码： #color-input-red +label{     display: block;     width:0.22rem;     height:0.22rem;     cursor: pointer;     position: absolute;     top: 0.09rem;     left: 0;     border: 1px solid #cccccc; } #color-input-red:checked +label::before{     display: block;     content: "2714";     text-align: center;     font-size:0.16rem;     line-height: 0.20rem;     color: #000000; }
//隐藏checkbox默认样式 input[type=checkbox]{     visibility: hidden; }

—-想了解更多的css相关样式处理怎么解决关注<计算机技术网(www.ctvol.com)!!>