用html代码编写一个简单的登陆界面

用html代码编写一个简单的登陆界面,第1张

<!DOCTYPE html><html lang="zh-CN"><head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1">

<title>登录</title>

<link href="css/bootstrap.min.css" rel="stylesheet"></head><body><nav class="navbar navbar-default">

<div class="container-fluid">

<div class="navbar-header">

<a class="navbar-brand" href="./">jsp作业</a>

</div>

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

<ul class="nav navbar-nav navbar-right">

<li><a href="login.html">登录</a></li>

</ul>

</div>

</div></nav><div class="container">

<div class="row">

<div class="col-md-4">

</div>

<div class="col-md-4">

<form class="form-signin" target="submitFrame" method="post">

<h2 class="form-signin-heading">登录到jsp作业</h2>

<label for="inputEmail">Email</label>

<input type="email" id="inputEmail" class="form-control" placeholder="请输入Email" required autofocus><br>

<label for="inputPassword">密码</label>

<input type="password" id="inputPassword" class="form-control" placeholder="请输入密码" required>

<div class="checkbox">

<label>

<input type="checkbox" value="remember-me" checked="checked">记住密码</label>

</div>

<button type="submit" class="btn btn-primary" id="btn-login">登录</button>

<a href="reg.html" class="btn btn-default">注册</a>

</form>

<iframe style="display: none" name="submitFrame" src="about:blank"></iframe>

</div>

<div class="col-md-4">

</div>

</div>

<script src="js/jquery.min.js"></script></body></html>

以下为个人原创教学例子,任何人引用需注明出自百度知道用户am7972,楼主可供参考\x0d\x0a该例子涵盖了文本框、密码框、下拉菜单、单选框、复选框及文本区的使用\x0d\x0a同时在数据的使用方面涵盖了文本型、数值型、日期型、布尔型的使用\x0d\x0a也涵盖了在会员信息入数据库前,进行严格的数据检查\x0d\x0a不足处,JS验证还不是太完善,不过有服务端认证足够了\x0d\x0a会员注册\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a

会员注员 \x0d\x0a

姓名: \x0d\x0a
密码: \x0d\x0a
性别: 男 女 \x0d\x0a
生日: \x0d\x0a
年龄: \x0d\x0a
爱好: 上网读书 体育 \x0d\x0a
上网方式: \x0d\x0a 拨号上网 无线上网 光纤上网 \x0d\x0a \x0d\x0a
个人简介:

\x0d\x0a\x0d\x0a\x0d\x0a\x0d\x0a====bb.asp的会员注册非法数据监测====\x0d\x0a0 Then\x0d\x0a Response.write "姓名不能包含特殊符号!@#$%^&*()_-+|?/"",." \x0d\x0a Response.End \x0d\x0a End If\x0d\x0aNext\x0d\x0a'判断密码合不合法,是否包含非法数据userPassword = Trim(userPassword)If userPassword ="" Then Response.write "密码不能为空" Response.EndEnd If\x0d\x0aIf Len(userPassword)>20 Then\x0d\x0a Response.write "密码字数不能超过20个字" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0a'判断密码合不合法,是否包含非法数据\x0d\x0aSex = Trim(Sex)\x0d\x0aIf Sex = "" Then\x0d\x0a Response.write "性别不能为空"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf Sex "True" And Sex "False" Then\x0d\x0a Response.write "性别不能为不男不女"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0a'判断生日合不合法,是否包含非法数据\x0d\x0auserSR = Trim(userSR)\x0d\x0aIf userSR ="" Then\x0d\x0a Response.write "生日不能为空"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf Len(userSR)10 Then '例如:2012-6-3 2012-11-23\x0d\x0a Response.write "你输入的生日字数不对,应为2012-6-3或2012-11-23格式" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf IsDate(userSR)=False Then\x0d\x0a Response.write "你输入的生日格式不能转化为日期,请核实" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf DateDiff("yyyy",userSR,Date())200 Then\x0d\x0a Response.write "根据你输入的生日你可能小于1岁或已经超过200岁了,请核查重新输入" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0a'判断年龄合不合法,是否包含非法数据userNL = Trim(userNL)If userNL ="" Then\x0d\x0a Response.write "年龄不能为空" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf IsNumeric(userNL)=False Then\x0d\x0a Response.write "你输入的年龄不能转化为数值,请核查"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0auserNL = CInt(userNL)\x0d\x0aIf userNL200 Then\x0d\x0a Response.write "你输入的年龄不能小于0岁或者大于200岁,请核查"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0a'判断爱好合不合法,是否包含非法数据ah = Trim(ah) '选择多个爱好则系统会用,分开 //测试\x0d\x0aah = Replace(ah," ","")\x0d\x0aarrAh = Split(ah,",")\x0d\x0aFor i = LBound(arrAh) To UBound(arrAh)\x0d\x0a If arrAh(i)"sw" And arrAh(i)"ds" And arrAh(i)"ty" Then \x0d\x0aResponse.write i & "你选择的爱好有问题,请核查" & arrAh(i)\x0d\x0aResponse.End\x0d\x0aEnd If\x0d\x0aNext\x0d\x0a'判断上网方式合不合法,是否包含非法数据swfs = Trim(swfs)If swfs = "" Then\x0d\x0a Response.write "上网方式不能为空"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf swfs"bhsw" And swfs"wxsw" And swfs"gxsw" Then\x0d\x0a Response.write "你选择的上网方式有问题,请核查"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0a'判断个人简介是否为空,是否超出1000个字\x0d\x0auserGrjs = Trim(userGrjs)\x0d\x0aIf userGrjs = "" Then\x0d\x0a Response.write "个人简介不能为空" \x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aIf Len(userGrjs) > 1000 Then\x0d\x0a Response.write "个人简介不能超过1000个字"\x0d\x0a Response.End\x0d\x0aEnd If\x0d\x0aResponse.write "数据合法性检测通过"\x0d\x0a%>\x0d\x0a====登陆的HTML代码可相信楼主参照会员注册代码应该没问题了====

首先要登陆自己的账号,这个工具是免注册的,微信扫一扫就登陆进去了;

进去后是模板页面,有很多有趣好玩的模板;

点击“我的”进入个人空间;

添加新折页。模板中有很多好玩的游戏,所以我们选择做一个相册;

可以扫码看一下初始的效果,决定了之后点击“开始制作”;

每一个标签页都有自己的内容,可以通过删除和复制自己控制模板的规格;

上传素材替换掉模板中的内容;

可以实时在手机上预览效果;

保存折页的时候记得修改页面上的信息;

好的制作者可是会利用这些信息吸引眼球哦~

在手机上预览没有问题后就可以直接右上角分享给朋友啦!~


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6128255.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-15
下一篇 2023-03-15

发表评论

登录后才能评论

评论列表(0条)