【任务目标】
根据所学JSP知识，根据前面实现的用户注册页面，使用JSP页面实现网上蛋糕商城注册页面。
代码下载（密码3535）：https://url47.ctfile.com/f/64055047-1497324283-256305?p=3535
一、创建顶部文件
右击web文件夹，选择New—>JSP/JSPX，名字为header.jsp
参考代码如下：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="header">
<div class="container">
<nav class="navbar navbar-default" role="navigation">
<!--navbar-header-->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/index" >首页</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle " data-toggle="dropdown">商品分类
<b class="caret"></b>
</a>
<ul class="dropdown-menu multi-column columns-2">
<li>
<div class="row">
<div class="col-sm-12">
<h4>商品分类</h4>
</div>
</div>
</li>
</ul>
</li>
<li><a href="#" >热销</a></li>
<li><a href="#" >新品</a></li>
<li><a href="#" class="active">注册</a></li>
<li><a href="#" >登录</a></li>
</ul>
<!--/.navbar-collapse-->
</div>
<!--//navbar-header-->
</nav>
<div class="header-info">
<div class="header-right search-box">
<a href="javascript:;">
<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
</a>
<div class="search">
<form class="navbar-form" action="/">
<input type="text" class="form-control" name="keyword">
<button type="submit" class="btn btn-default" aria-label="Left Align">
搜索
</button>
</form>
</div>
</div>
<div class="header-right cart">
<a href="goods_cart.jsp">
<span class="glyphicon glyphicon-shopping-cart " aria-hidden="true">
<span class="card_num"></span>
</span>
</a>
</div>
<div class="clearfix"> </div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<!--//header-->二、创建底部文件
右击web文件夹，选择New—>JSP/JSPX，名字为footer.jsp
参考代码如下：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!--footer-->
<div class="footer">
<div class="container">
<div class="text-center">
<p>heima www.itcast.cn © All rights Reseverd</p>
</div>
</div>
</div>
<!--//footer-->三、创建用户注册文件
右击web文件夹，选择New—>JSP/JSPX，名字为user_register.jsp
代码参考如下：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<title>用户注册</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link type="text/css" rel="stylesheet" href="css/bootstrap.css">
<link type="text/css" rel="stylesheet" href="css/style.css">
</head>
<body>
<!--header-->
<jsp:include page="/header.jsp"/>
<!--//header-->
<!--account-->
<div class="account">
<div class="container">
<div class="register">
<form action="/user_rigister" method="post">
<div class="register-top-grid">
<h3>注册新用户</h3>
<div class="input">
<span>用户名 <label style="color:red;">*</label></span>
<input type="text" name="username" placeholder="请输入用户名" required="required">
</div>
<div class="input">
<span>邮箱 <label style="color:red;">*</label></span>
<input type="text" name="email" placeholder="请输入邮箱" required="required">
</div>
<div class="input">
<span>密码 <label style="color:red;">*</label></span>
<input type="password" name="password" placeholder="请输入密码" required="required">
</div>
<div class="input">
<span>收货人<label></label></span>
<input type="text" name="name" placeholder="请输入收货">
</div>
<div class="input">
<span>收货电话<label></label></span>
<input type="text" name="phone" placeholder="请输入收货电话">
</div>
<div class="input">
<span>收货地址<label></label></span>
<input type="text" name="address" placeholder="请输入收货地址">
</div>
<div class="clearfix"> </div>
</div>
<div class="register-but text-center">
<input type="submit" value="提交">
<div class="clearfix"> </div>
</div>
</form>
<div class="clearfix"> </div>
</div>
</div>
</div>
<!--//account-->
<!--footer-->
<jsp:include page="/footer.jsp"/>
<!--//footer-->
</body>
</html>四、运行效果
运行tomcat，访问下面的地址
http://localhost:8080/chapter06/user_register.jsp访问后界面如下：
