纯CSS3代码实现switch滑动开关按钮效果

html结构

XML/HTML Code复制内容到剪贴板

1. <div class="container">  
2.         <div class="bg_con">  
3.             <input id="checked_1" type="checkbox" class="switch" />  
4.             <label for="checked_1"></label>  
5.         </div>  
6.     </div>  

css代码，:before负责颜色，:after是那个白色小圆点，切换时的过渡效果用css3的动画实现。

CSS Code复制内容到剪贴板

1. .switch{   
2.         display:none;   
3.     }   
4.     label{   </