css - 如何从此开关切换中隐藏复选框按钮？

Question

我想问一下是否可以隐藏/删除开关切换后面的复选框，或者至少将它向上移动以便我可以立即隐藏它？ http://jsfiddle.net/j0gd3awy/

HTML:

<input type="checkbox" id="switch">
<label for="switch" class="label"></label>

CSS:

.label {
border: 0;
width:50px;
height:20px;
background:#009688;
box-shadow: inset 0 0 0 30px #4a4a4a;
border-radius:30px;
display:block;
top:50px;
left:50px;
position:absolute;
z-index:1;
transition:all 300ms ease-in 0s;
}
#switch {
border: 0;
top:60px;
position:absolute;
left:57px;
}
#switch:before {
content:"";
position:absolute;
top:-20px;
left:-20px;
height:30px;
width:30px;
border-radius:50%;
display:block;
background:#009688;
border: 0;
z-index:2;  
box-shadow:inset 0 0 0 40px #616161,0 0 7px 0 #3b3b3b;
transition:box-shadow 500ms ease-in 0s, left 300ms ease-in 0s;
}
#switch:checked:before {
border: 0;
left:15px;
box-shadow:inset 0 0 0 0 #009688,0 0 7px 0 #3b3b3b;
}
#switch:checked + label {
border: 0;
box-shadow: inset 0 0 0 0 #616161;
}

Answer 1

检查一下 http://jsfiddle.net/probikram/tc1b59a1/

<div class="biksOne">
<input type="checkbox" value="None" id="biksOne" name="check" />
<label for="biksOne"></label>
</div>

希望对你有帮助。