网页的登录和注册页面

注册页面

代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>注册页面</title><style>.p{color:red;margin-left:20px;display:inline-block;}.c{color:red;margin-left:4px;display:inline-block;}.l{font-size:18px;}.d{height:35px;width:300px;display:inline;}.i{height:30px;width:300px;}.container {width: 70%;margin: 10% auto 0;background-color: #f0f0f0;padding: 2% 5%;border-radius: 10px;position: absolute;top: 50%;left: 50%;width: 100px;height: 500px;transform: translate(-50%, -50%);}</style>
</head>
<body><div style="height: 80px;"></div><form enctype="multipart/form-data"><div style="width:500px;float:left;margin:0 20px;" class="container"><div style="font-size:28px;">注册新用户</div><br/><span class="p">*</span><label for="username" class="l">用户名:</label><div style="height:35px;width:300px;position:relative;display:inline;"><input id="username" type="text" style="height:30px;width:250px;padding-right:50px;"><span style="position:absolute;right:18px;top:2px;background-image:url(user.ico);height:16px;width:16px;display:inline-block;" ></span></div><br/><br/><span class="p">*</span><label for="phonenumber" class="l">手机号:</label><div  class="d"><input id="phonenumber" type="text" class="i"></div><br/><br/><span class="c">*</span><label for="login_password" class="l">登录密码:</label><div  class="d"><input id="login_password" type="text" class="i"></div><br/><br/><span class="c">*</span><label for="confirm_password" class="l">确认密码:</label><div  class="d"><input id="confirm_password" type="text" class="i"></div><br/><br/><span class="p">*</span><label for="ver_code" class="l">验证码:</label><div  class="d"><input id="ver_code" type="text" class="i"></div><br/><br/><input type="checkbox" name="agree" style="margin-left:100px;display:inline-block;" value="1"/><span style="font-size:10px;">我已阅读并同意《用户注册协议》</span><br/><br/><input type="submit" value="同意以上协议并注册" style="margin-left:100px;height:30px;width:300px;display:inline-block;"/></div></form></body>
</html>

效果：

登录页面

代码：

<!DOCTYPE html>
<html lang="en"><head><meta charset="utf-8"><title>登录页面</title></meta><style>.container {width: 70%;margin: 10% auto 0;background-color: #f0f0f0;padding: 2% 5%;border-radius: 10px}h1{text-align: center;}</style></head><body><div style="height:80px;"></div><div style="width:500px;float: middle;margin:0 auto;" class="container"><h1>登录</h1><label for="username" style="font-size:18px">用户名：</label><div style="height:35px;width:400px;position:relative;display:inline"><input id="username" style="height:30px;width:350px;padding-right:50px;" type="text"><span style="position:absolute;right:18px;top:2px;background-image:url(user.ico);height:16px;width:16px;display:inline-block;"></span></input></div><br/><br/><label for="password1" style="font-size:18px">密码：</label><div style="height:35px;width:400px;position:relative;display:inline"><input id="password1" style="height:30px;width:350px;padding-right:50px;" type="text"><span style="position:absolute;right:16px;top:2px;background-image:url(p.ico);height:16px;width:16px;display:inline-block;"></span></input></div><br><br><div style="width:426px;float: middle;"><input name="auto_login" type="radio" value="1"/>自动登录<a herf="找回密码网址">忘记密码？</a><a href="http://111.229.210.226/04.html">注册</a></div><br/><br/><div style="width:426px"><a href="http://111.229.210.226/02.html"><input style="height:30px;width:200px;" type="submit" value="登录"/></a></div></input></div></body>
</html>

效果：

网页的登录和注册页面相关推荐

html网页制作—登录及注册页面设计
一.文字处理 1.文字加粗:<strong><\strong> 2.文字换行:<br/> 3.文档标题:title 4.整体文字居中<body align=& ...
jsp java servlet_jsp+java ，servlet如何实现用户登录和注册页面
jsp+java servlet实现简单用户登录(使用数据库,包括注册页面) 功能介绍本项目通过使用jsp和servlet实现简单的用户登录.主要逻辑为:如果用户不存在,则首先进行注册(注册信息同步 ...
Ant Design 编写登录和注册页面
Ant Design编写登录和注册页面前言一.登录 1.index.tsx页面 2.index.module.less 二,注册 1.index.tsx 2.index.module.less 总 ...
从0开始写Vue项目-Vue页面主体布局和登录、注册页面
1.从0开始写Vue项目-环境和项目搭建_慕言要努力的博客-CSDN博客 2. 从0开始写Vue项目-Vue2集成Element-ui和后台主体框架搭建_慕言要努力的博客-CSDN博客一.主体布局 ...
WordPress自定义登录和注册页面样式并且添加验证码
通过一番尝试和验证以及网络搜索,终于实现了WordPress默认的登录和注册界面的样式修改,下面把过程记录下来.笔者主要是通过在主题中添加WordPress的钩子来实现登录和注册界面的样式修改的.Wo ...
前端开发学习--登录和注册页面设计（html和css，可完成两个页面点击切换）
今天学习了登录和注册页面的设计,主要是HTML和CSS部分,注册和切换采用了Js代码进行,后面将通过js进行填写内容的验证,进而可通过JSP跳转到Servlet进行DAO数据的校验,这属于后端部分了. ...
vue3 导航守卫（在没有登录时只能一直在登录和注册页面）
记录在学习vue中的一些问题导航守卫,官方文档给出的定义: 你可以使用 router.beforeEach 注册一个全局前置守卫: const router = new VueRouter({ - ...
Java实现登录与注册页面
用java实现的登录与注册页面,实现了客户端(浏览器)到服务器(Tomcat)再到后端(servlet程序)数据的交互.这里在注册页面加入了验证码验证. 注册的html代码,页面非常丑!!请见谅.. ...
使用flask-WTF,Flask-Login，sqlite3实现登录和注册（前端登录和注册页面）
文章目录 1.文件结构: 2.实现效果: 3.使用的可视化工具(工具DB Browser for sqlite下载): 4.参考过的文章(一部分代码来自这里): 5.主文件.main.py: 6.前端 ...

网页的登录和注册页面

注册页面

登录页面

网页的登录和注册页面相关推荐

最新文章

热门文章