js实现带滑块拖动验证的登录框登录页效果代码
代码语言:html
所属分类:布局界面
代码描述:js实现带滑块拖动验证的登录框登录页效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> @charset "utf8"; *{ margin: 0; padding: 0; box-sizing: border-box; } a{ text-decoration: none; } li{ list-style: none; } img{ border: none; } html,body{ background-color: #F4F4F4; font-family: "微软雅黑"; font-size: 14px; color: #69696d; } .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; } .clearfix:after { clear: both; } /*======= 表单 =======*/ .login-box{ position: absolute; z-index: 9; width: 435px; top: 50%; left: 50%; margin-top: -200px; margin-left: -205px; padding-top: 45px; border: 1px solid #666; background: #373737; border-radius: 2px; box-shadow: 10px 10px 5px #000; color: #fff; } .login-box form{ position: relative; } .form-inline{ position: relative; display: block; } .form-inline + .form-inline{ margin-top: 10px; } .form-inline > div{ height: 40px; line-height: 40px; } .form-inline-font{ position: absolute; left: 0; width: 110px; padding-right: 10px; font-family: "Arial"; font-size: 15px; text-align: ri.........完整代码请登录后点击上方下载按钮下载查看
网友评论0