<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.wrap{ height:30px; width:60px;}
input{ display:none;}
label{background:#666; height:30px; width:60px; border-radius:20px; display:block;}
label span{ height:30px; width:30px; background:#fff; box-shadow:1px 1px 1px #ccc; display:block; border-radius:50%;text-align:center; line-height:26px;}
label span:before{content:'off'; }
input:checked+label{ background:#0FC;}
input:checked+label span{ margin-left:30px;}
input:checked+label span:before{ content:'on';}
</style>
</head>
<body>
<div class="wrap">
<input id="checked" type="checkbox" />
<label for="checked">
<span></span>
</label>
</div>
</body>
</html>
扫一扫
01-12
1351
1351
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
