用户登录和注册

最新推荐文章于 2024-04-30 07:45:00 发布
最新推荐文章于 2024-04-30 07:45:00 发布
阅读量2.4k 收藏 7
点赞数 1
分类专栏： html前端 文章标签： html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_63155268/article/details/121939141
版权





前言

第一次编写这么多行的代码,参考了CSDN的大神,@最小生成树 

在编写过程中遇到了不少问题,这里做一个小总结

提示：以下是本篇文章正文内容，下面案例可供参考






一、用户登录和注册

代码如下:

<!DOCTYPE html>
<!-- html部分 -->
<html>
	<head>
		<meta charset="utf-8">
		<title>用户登录注册界面</title>
	</head>
	<body>
	</body>
</html>
<div class="a1">
	<p class="c1">人物</p>
	<p class="c2">登录</p>
	<p class="c3">注册</p>
	<p class="c4"></p>
	<p class="c10">头像</p>
</div>


<div class="a2">
   <ul type="none" class="b1">
    <li><img src="img/v2-01115870fb7add0fab905c75d949e854_720w.jpg"/></li>
    <li><img src="img/v2-0869e1b49f4efcd2e2492d692acf86e3_720w.jpg"/></li>
    <li><img src="img/v2-0e239c79306aa2d79ea980db13cfd34a_720w.jpg"/></li>
    <li><img src="img/v2-cd771b74ec88ac279d3f985f38507193_720w.jpg"/></li>
    <li><img src="img/20201204041119176.jpg"/></li>
    <li><img src="img/20201204041144659.jpg"/></li>
    <li><img src="img/20201204041204388.jpg"/></li>
    <li><img src="img/20201204041219955.jpg"/></li>
   </ul>
   <ul type="none" class="bb1">
    <li><img src="img/v2-26f483abffadc602039bcfcca995ab0d_720w.jpg"/></li>
    <li><img src="img/v2-5a8219a2e8fbc60dd3bdef0c4e5ed0b1_720w.jpg"/></li>
    <li><img src="img/v2-7763891b56e81bd3cac64dfbd696a757_720w.jpg"/></li>
    <li><img src="img/v2-cd451be857e70030e55cbc642a2c9a89_720w.jpg"/></li>
    <li><img src="img/v2-dfe017a71a9771986d20b07904f5307b_720w.jpg"/></li>
    <li><img src="img/20201204041120102.jpg"/></li>
    <li><img src="img/20201204041144850.jpg"/></li>
    <li><img src="img/20201204041220221.jpg"/></li>
   </ul>
   <div class="b2">
    <p>人物</p>
   </div>
   <a>x</a>
   <div class="bb2">
    <p>更多人物</p>
   </div>
  </div>


<div class="a3">
	<div class="b3">
		<p>登录</p>
	</div>
	<div class="b4">
		<form method="post">
			<input value="手机号/身份证号/邮箱" type="text"/>
		</form>
	</div>
	<div class="b5">
		<form method="post">
			<input type="text" value="密码"/>
		</form>
	</div>
	<div class="b6">
		<form method="post">
			<input type="checkbox" value="记住密码"/>
				<p>记住密码</p>
		</form>
	</div>
	<div class="b7">
		<form method="post">
			<input type="submit" value="登 录"/>
		</form>
	</div>
	<div class="b8">
		<a href="">微信登录</a>
		<a href="">QQ登录</a>
	</div>
	<div class="b9"></div>
		<a class="c5">x</a>
	</div>
</div>

<div class="a4">
	<div class="b10">
		<p>注册</p>
	</div>
	<div class="b11">
		<form method="post">
			<input type="text" value="请输入账号" /><br />
		</form>
	</div>
	<div class="b12">
		<form method="post">
			<input type="text" value="请输入密码5~10位" maxlength="10" /><br />
		</form>
		<div class="c6">
			<p class="d1"></p>
			<p class="d2"></p>
		</div>
	</div>
	<div class="b13">
		<form method="post">
			<input type="text" value="再次确认密码" maxlength="10"/>
		</form>
		<div class="c7">
			<p class="d3"></p>
			<p class="d4"></p>
		</div>
	</div>
	<div class="b14">
		<form method="post">
			<input type="text" value="请输入邮箱" />
		</form>
	</div>
	<div class="b15">
		<form method="post">
			<input type="submit" value="注册" />
		</form>
	</div>
	<div class="b16">
	</div>
		<a>x</a>
		<div class="b17">
			<p>头像</p>
		</div>
</div>

<div class="a5">
	<ul type="none" class="c8">
		<li><img src="img/08211345614016.jpg"/></li>
		<li><img src="img/08211345614016.jpg"/></li>
		<li><img src="img/08211345614016.jpg"/></li>
		<li><img src="img/08211345614016.jpg"/></li>
		<li><img src="img/08211345614016.jpg"/></li>
		<li><img src="img/08211345614016.jpg"/></li>
	</ul>
	<div class="c9">
		<p>x</p>
	</div>
</div>

<!-- css部分 -->
<style type="text/css" class="a">
	body{
		width: 1280px;
		margin: 0px;
		padding: 0px;
		background-image: url(img/ee54bd1da93541b9b5bc6cd2cb854214.jpeg);
	}
	.a1{
		width: 1280px;
		height: 56px;
		background: rgba(0,0,0,0.2);
		position: ralative;
		bottom: 14px;
	}
	.a1 p{
		width: 40px;
		height: 30px;
		font-size: 14px;
		color: pink;
		text-align: center;
		line-height: 30px;
	}
	.a1 .c4{
		width: 50px;
		height: 50px;
		background-color: blue;
		position: relative;
		left: 610px;
		bottom: 128px;
		border-radius: 50%;
		background-image:url(img/d7c26829c3924c4dbc567edb9b02d5b7.jpeg);
	}
	.a2{
	    width: 300px;
	    height: 480px;
	    position: absolute;
	    top: 106px;
	    left: 70px;
	    background: rgba(0,0,0,0.5);
	    border-radius: 7px;
	    display: none;
	   }
	    .a2 img{
	       width: 125px;
	       height: 100px;
	       margin-left: 5px;
	       margin-bottom: 5px;
	       float: left;
	      }
	      .a2 a{
	       width: 20px;
	       height: 20px;
	       border-radius: 50%;
	       border: 1px solid white;
	       float: left;
	       font-size: 18px;
	       color: white;
	       text-align: center;
	       line-height: 15px;
	       position: absolute;
	       left: 268px;
	       top: 10px;
	      }
	.a3{
		width: 300px;
		height: 480px;
		position: absolute;
		left: 885px;
		top: 105px;
		background: rgba(0,0,0,0.5);
		border-radius: 7px;
		display: none;
	}
	.a4{
		width: 300px;
		height: 480px;
		position: absolute;
		top: 106px;
		left: 475px;
		background: rgba(0,0,0,0.5);
		border-ra
最低0.47元/天 解锁文章
Hachier_
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaWeb核心技术——Request&Response用户登录注册案例
成功在于坚持！
03-30 2040
目录 1，用户注册登录案例 1.1 用户登录 1.1.1 需求分析 1.1.2 环境准备 1.1.3 代码实现 1.2 用户注册 1.2.1 需求分析 1.2.2 代码编写 1.3 SqlSessionFactory工具类抽取 1，用户注册登录案例 接下来我们通过两个比较常见的案例，一个是注册，一个是登录来对今天学习的内容进行一个实战演练，首先来实现用户登录。 1.1 用户登录 1.1.1 需求分析 用户在登录页面输入用户名和密码，提交请求给LoginServlet
HTML知识整理(form表单简单实现登录注册界面)
qq_53909398的博客
01-09 4160
代码段： <!----注释 from表单:作用收集用户的基本信息 <from>内容</from> 表单属性:action 服务器地址 比如:192.168.1111.3:8080 method 提交方式 post get 其中post更加安全 下面是默认登录注册界面的写法 -----> <!DOCTYPE html> <html> <head> <title>from表单</t.
JavaWeb：掌握Session的使用，完善用户登录注册案例的功能
黑马程序员官方博客
04-08 2595
↑↑Java语法基础 —> 小型项目练习 —> MySQL 更多学习内容均更新在专栏了，记得关注专栏哦 ↑↑ 🍬JDBC：从CRUD开始，理解JDBC中的各个对象作用，掌握Druid的使用 🍬Maven从安装到手把手教学进行项目管理 🍬MyBatis完成代理方式查询数据以及核心文件配置、 🍬Mybatis：使用映射配置文件实现CRUD操作，能够使用注解实现CRUD操作 🐒HTML标签大全，存起来总有一天用的上 🐒Java后端学习之CSS内容 🐒Jav
登录与注册（JDBC）
最新发布
m0_75073812的博客
04-30 1006
JDBC的使用，安装连接数据库
APP的注册和登录功能设计
再见孙悟空的专栏
11-30 2247
一、为什么需要注册和登录? 　　是否需要注册和登录的关键取决于产品形态。 　　如果用户注册登录对于用户需求、产品功能、商业模式本身带不来任何价值的话，就没必要设计这样的功能。比如一些实用工具类的产品：计算器、手电筒、无社交属性的天气预报等等。 　　其它像强社交需求的产品(微信)、涉及到较多用户财产安全的产品(支付宝)、用户对信息使用比较关注的产品(邮箱)等，都需要账户体系的支持，
用户登录(记住用户)&用户注册(验证码) [运用Cookie Session技术]
lwj_07的博客
06-26 1419
需求如下： （相比以前的登陆注册添加的新功能如下框）用户登录总代码结构如下： User实体类： UserServlet： UserMapper： 登录失败/成功结果演示：登录成功： 登录失败： 记住一句话：重定向会改变URL路径 也就是说我们重定向中写的一个路径，URL会变成该写的路径,转发不改变URL路径核心代码如下所示：login.jsp：先访问login.jsp然后提交到loginServlet路径资源下 再继续其他的操作（转发） LoginServlet：登录失败的话就跳跳转到lo
VB实现网站用户登录和注册功能程序源码
01-20
【工控老马出品，必属精品，亲测校正，质量...资源名：VB实现网站用户登录和注册功能程序源码 资源类型：程序源代码 源码说明：包含 登录、注册、更改密码 功能，很适合学习借鉴 适合人群：新手及有一定经验的开发人员
使用PHP实现用户登录和注册的功能——用户表
09-28
在本文中，我们将深入探讨如何使用PHP来实现用户登录和注册功能，主要关注与数据库交互的部分，特别是用户表的设计和管理。PHP是一种广泛用于Web开发的脚本语言，结合MySQL数据库，可以创建安全且功能丰富的用户管理...
Android用户登陆和注册界面
08-24
服务器端需要实现注册和登录接口，接收客户端发送的数据，验证用户信息，存储用户数据到数据库（如MySQL、SQLite或MongoDB），并生成会话令牌。安全方面，应使用哈希加盐（Hashing with Salt）方法存储密码，以保护...
Laravel实现用户注册和登录
10-24
本文详细给我们展示了使用Laravel实现用户注册和登录的方法和步鄹,需要的朋友可以参考下
漂亮用户登录注册
08-19
标题中的“漂亮用户登录注册”指的是一个设计美观且功能完整的用户身份验证系统，它涵盖了用户登录和注册的主要功能。在Web开发中，这样的系统是必不可少的，它为用户提供了一个安全的途径来创建账户并访问受保护的...
用户登陆注册系统
05-13
这是自己编写的一个用户注册登陆管理系统，采用了中国开源框架dwz作为主页模板，mysql作为后台数据库，运用struts2实现对用户登陆，希望可以给大家参考！
首页登录和注册
白长生的小窝
04-28 3万+
01-登录业务介绍 1. 用户登录业务介绍 1.1. 单一服务器模式 早期单一服务器，用户认证。 缺点：单点性能压力，无法扩展 1.2. SSO(single sign on)模式 分布式，SSO(single sign on)模式 优点 ： 用户身份信息独立管理，更好的分布式管理。 可以自己扩展安全策略 缺点： 认证服务器访问压力较大。 1.3. Token模式 业务流程图{用户访问业务时...
登录与注册
热门推荐
哈尼熊熊的博客
07-25 8万+
1. 几种常见的注册 1.用户角度，通过注册、登录获取自己唯一的识别号，相当于获取了一张“身份证”。通过“身份证”App会记住该用户每次的操作行为（浏览记录、收藏记录、购买记录等），并且在和其他用户产生互动交流时来表明自己是谁。 2.企业角度，收集用户信息，建立企业用户体系，来进行用户分析和用户运营等等，目的是为企业带来更多的价值。 3.响应国家网络实名制的要求。（一般会验证手机号或身份证号...
项目学习 —— 登录与注册（完整）
Archer__13的博客
04-08 2782
一. 创建动态Web工程 参考：https://blog.csdn.net/Archer__13/article/details/123388390 ​ ①web目录存放web工程的资源文件，例如：html页面、css文件、js文件等，将写好的web页面放到该目录下（首页、用户登录页面、用户注册页面）； ②web目录下的WEB-INF目录是受服务器保护的目录，浏览器无法直接访问此目录的内容； ③在WEB-INF目录下创建一个lib目录用来存放所需要的第三方jar包； ...
用户登录、注册最基本的流程图
笑笑是一个码农
10-13 7万+
用户登录、注册最基本的流程图：
Mob教你汇总常见的用户注册和登录方式
apkkkk的博客
12-23 1452
目前市面上APP的常见的用户注册和登录方式有三种，第一种是最早期的手机号码+密码登录，第二种是常见的 手机号码+短信验证码，第三者是最新推出，且正被各大应用APP接入采用的" 一键登录"秒验方式。劣势：操作步骤较多，在高峰期时，还会出现无法接收短信验证码的情况，导致用户体验较差而流失。优势：操作非常简单便捷，傻瓜式操作，无感验证，比第一种和第二种都要便捷很多。运行方式：需要用户手动输入手机号和密码，先注册再登录，在服务器进行认证。运行方式：用户输入手机号，等待短信，输入短信进行验证登录。
实现用户登录与用户注册的思路
alexdedream的博客
09-17 1万+
正常的主页面应该有两个功能，一个是用户登录，一个是用户注册。 用户注册比较来说简单一点，主页面单击用户注册按钮，直接定位到注册页面，填写用户名和密码等等，单击提交，到后台action页面进行逻辑判断，查询这个用户名在数据库是否已经存在。 两种情况，如果不存在，直接保存，重定向到登录页面。 如果存在，直接抛异常，自定义异常信息用户已存在，在action中进行捕获，并且将错误信息放入到reqeu...
javaweb用户登录和注册系统
05-31
接着，您可以使用JSP和Servlet来实现用户注册和登录功能。以下是一些基本的实现思路： 1. 用户注册 用户在注册页面输入自己的信息后，点击“注册”按钮，Servlet会将用户信息插入到数据库中。这里需要注意的是，...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值