这个首页的html5网站设计代码(尤其是头部那登录注册代码怎么写)

这个首页的html5网站设计代码(尤其是头部那登录注册代码怎么写),第1张

首先先说一下HTML5的代码只是在原有的XHTML基础上增加了一些新的标签(还有一些新的特性,例如数据库和缓存等特性)

以下为此页面的结构代码:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta name="revised" content="" />

<meta name="keywords" content="" />

<meta name="description" content="" />

<meta name="author" content=""  />

<meta name="robots" content="all" />

<title>页面标题</title>

</head>

<body>

<header>

<div></div><!--登陆注册区域-->

</header><!--头部[html5新标签]-->

<nav></nav><!--导航[html5新标签]-->

<div></div><!--banner-->

<div></div><!--左上-->

<div></div><!--右上-->

<div></div><!--左下-->

<div></div><!--右下-->

<footer></footer><!--底部[html5新标签]-->

</body>

</html>

注:以上为页面的大的框架,相对用HTML5新的标签更合理的,全用上了新的带有语义标签。

另外多说一下,[注册登陆]这块在html5的新标签里面没有很合适的语义化的标签,所以依然采用原有的div标签为最合理。html5只是在原有的技术的基础上更细化了,咱在制作代码的过程中没必要必须用HTML5的代码,主要看是否合理,合理的为较合适的。

多说的:不管用XHTML还是HTML5写代码,结构(HTML5)与样式(CSS)尽量要分离!

希望能帮到你!

你写注册页面,如果要在这个页面验证并d出提示框就要用到js,

也可以提交给一个php页面处理,post到一个php文件,对注册信息进行过滤,

符合就添加不符合继续注册,信息符合后就连接数据库,插入这条数据。

登录的时候实际上是做一个查询,看数据表中有没有你登录输入的数据,有就登录成功,没有就跳到登录页提示用户名或者密码不正确,或者跳转到注册页提示此账号不存在请先注册。逻辑就是这样,代码量也蛮少。

<!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>


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

原文地址:https://54852.com/zaji/7679193.html

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

发表评论

登录后才能评论

评论列表(0条)

    保存