jquery简洁的登录注册页面效果代码
代码语言:html
所属分类:布局界面
代码描述:jquery简洁的登录注册页面效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css"> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons'> <style> html { width: 100%; height: 100%; } body { background: linear-gradient(45deg, rgba(66, 183, 245, 0.8) 0%, rgba(66, 245, 189, 0.4) 100%); color: rgba(0, 0, 0, 0.6); font-family: "Roboto", sans-serif; font-size: 14px; line-height: 1.6em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .overlay, .form-panel.one:before { position: absolute; top: 0; left: 0; display: none; background: rgba(0, 0, 0, 0.8); width: 100%; height: 100%; } .form { z-index: 15; position: relative; background: #FFFFFF; width: 600px; border-radius: 4px; box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-sizing: border-box; margin: 100px auto 10px; overflow: hidden; } .form-toggle { z-index: 10; position: absolute; top: 60px; right: 60px; background: #FFFFFF; width: 60px; height: 60px; border-radius: 100%; transform-origin: center; transform: translate(0, -25%) scale(0); opacity: 0; cursor: pointer; transition: all 0.3s ease; } .form-toggle:before, .form-toggle:after { content: ""; display: block; position: absolute; top: 50%; left:.........完整代码请登录后点击上方下载按钮下载查看
网友评论0