基于vue，elementui的注册页面源码

HTML

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>新用户注册 USER REGISTER</title></head><script src="static/Vue.jsv2.6.12.js" type="text/javascript" charset="utf-8"></script><script src="static/element-ui/lib/index.js" type="text/javascript" charset="utf-8"></script><link rel="stylesheet" type="text/css" href="static/element-ui/lib/theme-chalk/index.css" /><body><div id="registbody"><center><h3 class="xyhzcfont">新用户注册 USER REGISTER<h3></center><el-row><!--  left --><el-col :span="6"></el-col><!-- center --><el-col :span="10" offset="7"><el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign"><el-form-item label="用户名"><el-input v-model="formLabelAlign.name"></el-input></el-form-item><el-form-item label="密码"><el-input v-model="formLabelAlign.region"></el-input></el-form-item><el-form-item label="Email"><el-input></el-input></el-form-item><el-form-item label="姓名"><el-input></el-input></el-form-item><el-form-item label="手机号"><el-input></el-input></el-form-item><el-form-item label="性别"><el-radio-group v-model="radio"><el-radio :label="3">男</el-radio><el-radio :label="6">女</el-radio></el-radio-group></el-form-item><el-form-item label="出生日期"><el-date-picker style="width: 100%" v-model="csrq" type="date" placeholder="选择日期"></el-date-picker></el-form-item><el-form-item label="验证码"><el-row><el-col :span="11"><el-input></el-input></el-col><el-col :span="11" offset="2"><img style="width: 100%; height: 100%;" src="img/verify_code.jpg" /></el-col></el-row></el-form-item><el-form-item><el-button style="width:100%" type="warning">注册</el-button></el-form-item><center><a href="#">已有账号?</a>&nbsp;&nbsp;&nbsp;<a href="#">立即登录</a></center></el-form></el-col><el-col :span="6"> </el-col></el-row></div></body><script src="js/regist.js" type="text/javascript" charset="utf-8"></script><link rel="stylesheet" type="text/css" href="css/regist.css" />
</html>

CSS

#registbody {width:65%;background-color: white;margin: auto;margin-top: 20px;/* 内边距 */padding: 10px;
}
body{background-image: url(../static/新建文件夹/10.png);background-size: 100% 100%;background-attachment: fixed;
}/* 超链接 */
a{text-decoration: none;
color: orange;
}
a:hover{color: #0000FF;
}
/* 新用户注册文字 */
.xyhzcfont{text-align: center;color: orange;
}

new Vue({el:"#registbody",data:{labelPosition: 'right',formLabelAlign: {name: '',region: '',type: ''},radio: '',csrq:''}
});

基于vue，elementui的注册页面源码相关推荐

html透明表单登录注册页面源码
大家好,今天给大家介绍一款,html透明表单登录注册页面源码(图1).送给大家哦,获取方式在本文末尾. 图1 自适应页面,适合于各种分辨率(图2) 图2 部分源码: <!doctype html ...
html源码表单页面,HTML-表单标签form及注册页面源码
表单标签用来盛放给用户输入信息的标签的空间应用:一般的登录页面就是用表单标签做的属性: action:提交后跳转的链接页面(携带用户输入的信息作为参数) method:传递参数的方式(get/p ...
java计算机毕业设计基于springboot+vue+elementUI的旅游网站(源码+数据库+Lw文档）
项目介绍旅游管理平台采用B/S模式,促进了旅游管理平台的安全.快捷.高效的发展.传统的管理模式还处于手工处理阶段,管理效率极低,随着用户的不断增多,传统基于手工管理模式已经无法满足当前用户需求,随着 ...
带翻转特效的会员登录注册html页面源码
大家好,今天给大家介绍一款,带翻转特效的会员登录注册html页面源码(图1).送给大家哦,获取方式在本文末尾. 图1 点击登录和注册切换时,带翻转特效(图2) 图2 源码完整,需要的朋友可以下载学习( ...
完整企业官网源码，前端基于Vue+ElementUI，后台基于基于core3 webapi，含数据库文件，含详情安装部署文档
完整企业官网源码,前端基于Vue+ElementUI,后台基于基于core3 webapi,含数据库文件,含详情安装部署文档完整代码下载地址:完整企业官网源码某工程管理有限公司企业官网前端新版 ...
计算机毕业设计基于springboot+vue+elementUI的网吧管理系统(源码+系统+mysql数据库+Lw文档）
项目介绍随着我国的经济发展,人们的生活水平也有了一定程度的提高,对网络的要求也越来越高,很多家庭都有了自己的电脑,但是很多时候大家在家里玩电脑的时候找不到那种玩耍的气氛和氛围,这个时候大家就都选择了 ...
基于vue+elementui婚纱摄影网站SSM+java毕业设计源码介绍
一.源码描述这是一款基于web的前后端分离JAVA+SSM和vue.js源码基于B/S开发,包含毕业论文和答辩ppt开发工具idea支持eclipse,MySQL,适合作为毕业设计使用,感兴趣 ...
vue.js实现的，添加和删除代办事项列表页面源码
大家好,今天给大家介绍一款,vue实现的,添加和删除代办事项列表页面源码(图1).送给大家哦,获取方式在本文末尾. 图1 可以添加代办事项.删除代办事项.将未完成任务移动到列表前面(图2) 图2 代码 ...
spyder开多个程序_【程序源代码】基于Vue+ElementUI web开发框架
" 关键字:开发框架 vue web 开发框架" 正文:开发框架 web 开发框架 vue 01 - 基于 Vue + ElementUI 的web项目工程框架专注于中台系统 ...

基于vue，elementui的注册页面源码

基于vue，elementui的注册页面源码相关推荐

最新文章

热门文章