- .onoff{ overflow: hidden; display: inline-block; margin:0 0 -5px 15px; width: 60px;height:20px; border-radius: 20px; border: solid 1px #999;}.onoff label{ display: block; margin-left: -40px; width: 100px;height: 20px; text-align: right;color: #8B8B8B;border-radius:20px; background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#DFDFDF),color-stop(1,#FEFEFE));}.onoff label::after{ position: relative;left:-17px;top: -20px; display: inline-block; content: '';width: 6px;height: 6px; border: solid 2px #999; border-radius: 10px;}.onoff i{ display: block; width: 60px;height: 20px; border-radius:20px; background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FE7D00),color-stop(1,#FEA753));}.onoff i::before{ position: relative;top: -7px;left:-15px; display: inline-block; content: '';width: 2px;height: 10px; background-color: #fff;}.onoff i::after{ position: relative;top: -1px;left:1px; display: inline-block; content: '';width: 20px;height: 20px; border: solid 1px #999; border-radius: 50px; background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#DADADA),color-stop(1,#FAFAFA)); box-shadow: inset 0 0 1px #fff;}
来源: http://www.daqianduan.com/4548.html