Question

纯css3改变checkbox样式怎么获取值

Answer 1

<div class="sect selected{{selected}}">
<input type="checkbox" id="checkbox" checked>
<label for="checkbox" ng-click="changeSelected()"></label>
</div>

CSS代码
.sect{width: 65px; height: 30px; background-color: #cccccc; display:
inline-block; text-align: center; position: relative;}
.sect input[type='checkbox']{visibility: hidden;}
.sect label{width: 30px; height: 28px; display:
block; top:1px; left: 1px; position: absolute;
background-color: #fafafa; z-index: 1; transition: all 0.4s ease;
-o-transition: all 0.4s ease; -moz-transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;}
.sect input[type='checkbox']:checked + .sect{background-color: #32b16c!important;}
.sect input[type='checkbox']:checked + label[for='checkbox']{left: 34px!important;}