jquery+css实现卡片式旋转切换登录注册表单页面代码-html代码-BFW代码库

jquery+css实现卡片式旋转切换登录注册表单页面代码

代码语言：html

代码描述：jquery+css实现卡片式旋转切换登录注册表单页面代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
        html{margin:0;height:100%}body{margin:0;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;display:-webkit-flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#2196F3}.form-collection{width:350px;height:350px}.limit-width{width:300px}.absolute-footer{bottom:0;left:0;position:absolute;z-index:1;text-align:center;font-family:"Roboto",sans-serif;font-size:27.2px;font-size:1.7rem;font-weight:300;padding:15px;background:rgba(0,0,0,0.4);color:#fff}.form-collection{z-index:2}.card{font-family:"Open Sans",sans-serif;background:#fff;position:absolute;-webkit-transition:.3s ease all;transition:.3s ease all}.card-body{padding:20px}.box-btn{text-decoration:none;text-align:center;text-transform:uppercase;display:block;padding:15px;font-size:16px;font-weight:500;color:#444;background:rgba(0,0,0,0);-webkit-transition:.2s ease all;transition:.2s ease all;border-radius:3px}.box-btn:hover{background:rgba(0,0,0,0.06)}.box-btn:active{background:rgba(0,0,0,0.1)}.input-group{border:2px solid #eee;position:relative;background:#eee;margin:25px 0;border-radius:2px;overflow:hidden;padding:10px}.input-group input{border:0;background:transparent;width:100%;outline:0;font-weight:500;font-family:"Open Sans",sans-serif;font-size:16px}.input-group label{position:absolute;top:10px;left:0;padding-left:10px;font-weight:500;color:#aaa}.card-footer button{width:100%;padding:25px;font-size:24px;font-size:1.5rem;text-.........完整代码请登录后点击上方下载按钮下载查看