1问题描述
单纯的用form标签加div加input会使div里的元素在对齐上出现问题。如：
在这个网页中用户类别与用户性别与其他几项有很明显的区别——没有对齐，但我们所需要的又是要各项都对齐的网页。如：
2算法描述
网页中的元素没有对齐是因为我只用了div标签并使用text-align:center来使div里的元素居中，但用户类别与用户性别所占空间比其他几项要小，因此导致了页面内的元素没对齐。
解决方法：我们可以使用ul标签或table标签来使其对齐，达到我们所需要的结果。我采用的table标签来使其对齐
代码清单1
代码语言：javascript复制 <div id="div1">
<h2>注册</h2>
<table align="center">
<tr>
<td>用户姓名:</td>
<td><input id="userman" type="text" autofocus required></td>
</tr>
<tr>
<td>手机号:</td>
<td><input type="text" id="identify"></td>
<td><button>获取验证码</button></td>
</tr>
<tr>
<td>输入验证码:</td>
<td><input type="text"></td>
</tr>
<tr>
<td>用户密码:</td>
<td><input id="password" type="password" required></td>
</tr>
<tr>
<td>确认密码:</td>
<td><input id="surepassword" type="password" required></td>
</tr>
<tr>
<td>用户类型:</td>
<td><select name="type" id="userType">
<option value="0">请选择</option>
<option value="1">游客注册</option>
<option value="2">商家注册</option>
</select></td>
</tr>
<tr>
<td>用户性别:</td>
<td><input class="usersex" name="sex" value="boy" type="radio">男
<input class="usersex" name="sex" value="girl" type="radio">女</td>
</tr>
<tr>
<td>出生日期:</td>
<td><input id="brithday" type="data"></td>
</tr>
<tr>
<td>电子邮件:</td>
<td><input id="email" type="email" required></td>
</tr>
<tr>
<td></td>
<td><input type="submit" class="button" onblur="checkform()" onclick='window.open("登录.html")' value="提交"></td>
</tr>
</table>
</div>3 结语
使用了table标签后，页面的各个元素都对齐了，达到了我们所需要的结果。
稿件来源：深度学习与文旅应用实验室（DLETA）
作者：王雷
主编：欧洋
