2.10综合实战——制作用户注册页面
时间：2020/9/17 21:40:31阅读：
2.10综合实战——制作用户注册页面
2.10 综合实战——制作用户注册页面
在每个大型网站中，通常都有会员注册页面，用来收集客户相应信息。例如淘宝网会员注册页面、搜狐博客注册页面等。不同网站，其注册页面也不一样，但其实质都是使用HTML表单完成。本实例将结合本节所介绍的知识点，创建一个简单的注册页面。
具体操作步骤如下。
01 分析需求。创建一个注册页面，主要用来收集客户信息，例如客户名称、性别、密码、住址、联系方式、兴趣爱好等，其注册选项种类很多，这里只使用最简单的选项注册。完成之后，该实例效果如图2-22所示。
图2-22 注册页面显示
02 分析整体和局部并创建HTML页面。一个注册页面，包含两个部分，一部分是表单及名称，一部分是表单控件。创建HTML页面，其基本代码如下所示。
<html> <head> <title>注册页面</title> </head><body></body> </html>
在IE 8.0中浏览效果如图2-23所示，可以看到网页中无任何内容显示。
图2-23 空文档显示
03 创建表单及名称。在正文部分，创建表单名称，其代码如下所示。
<form name="form1" method="post" action=""> <h1 align=center>用户注册</h1> </form>
在IE 8.0中浏览效果如图2-24所示，可以看到标题居中显示。
图2-24 表单显示
04 创建表单控件。下面就可以在表单中创建各个表单控件其代码如下所示。
用 户 名：<input type="text" name="name"><br> 密 码：<input type="password" name="psd"><br> 确认密码：<input type="password" name="psd1"><br> 性 别： <input type="radio" name="rb" value="1" checked>男 <input type="radio" name="rb" value="0">女<br> 爱 好： <input type="checkbox" name="cb" value="1">运动 <input type="checkbox" name="cb2" value="2">写作 <input type="checkbox" name="cb3" value="3">旅游<br> E - Mail：<input type="text" name="email"><br> <input type="submit" value="提交"> <input type="reset" value="重置">
在IE 8.0中浏览效果如图2-22所示，可以看到表单中显示表单元素，包括文本输入框、单选按钮、复选框和按钮等。