[sourcecode language=”html” title=”zhuce.html”]
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<link rel="stylesheet" href="css/zhuce.css" type="text/css">
<script language="javascript" src="js/zhuce.js" type="text/javascript"></script>
</head>
<body>
<h2 class="t3">填写注册信息</h2>
<hr color="#BBFFBB" size=2/>
<br>
<form action="doSubmit.jsp" method="post">
<table width="700px" cellspacing ="0" align="center">
<tr class="t1">
<td class="t2">用户名:*</td>
<td width="200px" ><input type="text" name="userName" style="width:190px;height:18px"/></td>
<td width="400px" >用户名由字母开头,后跟字母、数字或下划线!</td>
</tr>
<tr class="t1">
<td class="t2">密码:*</td>
<td width="200px" ><input type="password" name="userPwd" style="width:190px;height:18px"/></td>
<td width="400px" >设置登陆密码,至少6位!</td>
</tr>
<tr class="t1">
<td class="t2">确认密码:*</td>
<td width="200px" ><input type="password" name="userPwd1" style="width:190px;height:18px"/></td>
<td width="400px" >请再输入一次你的密码!</td>
</tr>
<tr class="t1">
<td class="t2">性别:*</td>
<td width="200px" ><input type="radio" name="userXinbie" value="男" />男
<input type="radio" name="userXinbie" value="女" />女</td>
<td width="400px" >请选择你的性别!</td>
</tr>
<tr class="t1">
<td class="t2">邮箱地址:*</td>
<td width="200px" ><input type="text" name="userEmail" style="width:190px;height:18px"/></td>
<td width="400px" >请填写你的常用邮箱,可以用此邮箱找回密码!</td>
</tr>
<tr height ="100px">
<td width="100px" align="right" valign="top" >基本情况:*</td>
<td colspan="2" ><textarea cols="55" rows="6" name="userQingkuang"></textarea></td>
</tr>
<tr class="t1">
<td colspan="3" align="center"><input type="checkbox" name="accept" value="yes" /> 我已经仔细阅读并同意接受用户使用协议</td>
</tr>
<tr height="40px">
<td colspan="3" align="center">
<input type="Button" value="注册" onClick="validate()" />
<input type="reset" value="取消" name="quxiao"></td>
</tr>
</table>
</form>
<hr color="#BBFFBB" size=2/>
</body>
</html>
[/sourcecode]
[sourcecode language=”css” title=”css/zhuce.css”]
@charset "UTF-8";
.t1{height:25px;}
.t2{text-align:right;}
.t3{text-align:center;}
[/sourcecode]
效果图:
zhuce.html源代码下载:[bdbtn]https://pan.benzhu.xyz/%E4%BB%A3%E7%A0%81/%E6%BA%90%E4%BB%A3%E7%A0%81/html/zhuce.html[/bdbtn]
css/zhuce.css自己创建复制粘贴就好,注意路径!