TweenMax渐变开关复选框效果代码
代码语言:html
所属分类:表单美化
代码描述:TweenMax渐变开关复选框效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600); * { box-sizing:border-box } html { font-family:Open Sans,serif; text-align:center } a { text-decoration:none } h1 { max-width:500px; font-size:24px; color:white; margin:20px auto 10px auto } h1 a { font-weight:600 } h2 { margin-top:0; font-size:34px; font-weight:600; color:white } p { margin:10px 0 30px 0; color:white } p.last { margin-top:10px; margin-bottom:15px } body,html { background-color:#24282c } .checkbox__center { display:inline-block; margin:0 auto } .checkbox__wrapper { width:138px; height:65px; -moz-border-radius:65px; -webkit-border-radius:65px; border-radius:65px; overflow:hidden; position:relative; border:2px solid #10393e } input[type="checkbox"] { display:none } input[type="checkbox"]+label { display:inline-block; width:100%; height:100%; -moz-border-radius:65px; -webkit-border-radius:65px; border-radius:65px; overflow:hidden; position:relative; z-index:1; cursor:pointer } input[type="checkbox"]+la.........完整代码请登录后点击上方下载按钮下载查看
网友评论0