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

        left: 50%;     
        margin-top: -11px;     
        margin-left: -11px;   
        width: 22px;   
        height: 22px;   
        border-radius: 22px;   
        background-color: white;   
        box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.08);   
        -webkit-transform: translateX(-9px);   
        -webkit-transition: all 0.3s ease;   
    }   
    .switch:checked~label:after{   
        -webkit-transform: translateX(9px);   
    }   
    .switch:checked~label:before{   
        background-color:green;   
    }    

以上所述是小编给大家介绍的纯CSS3代码实现switch滑动开关按钮效果 ，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持！