CSS实现的ios样式Toggle开关按钮

一款很轻的iOS样式开关小部件，使用纯CSS代码实现的HTML复选框，基于CSS flexbox充分响应和灵活。.toggle { background-color: grey; width: 60px; height: 32px; border-radius: 16px; display: flex; flex-direction: column; } .toggle-active { background-color: blue; width: 60px; height: 32px; border-radius: 16px; display: flex; flex-direction: column; align-items: flex-end; } input { display: none; } .slider { height: 24px; width: 24px; background-color: white; border-radius: 12px; margin: 4px; } input:checked + .toggle { background-color: green; } input:checked + .toggle > .slider { align-self: flex-end; }

在线演示        积分下载        6毛下载        砍两刀下载       

未经允许不得转载： ICode联盟 » 插件特效 » CSS实现的ios样式Toggle开关按钮