HTML——使用表格對表單進行布局 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>使用表格對表單進行布局</title>
</head>
<body>
<form action="#" method="post">
<table width="450" border="0" bgcolor="#000000" cellspacing="1" cellpadding="2"><!--cellspacing指相鄰單元格之間的間距。cellpadding指控制單元格内部文字與邊框的邊距-->
<tbody>
<tr height="30">
<td colspan="2" align="center" bgcolor="#CCCCCC"><font size="5">使用者注冊</font></td>
</tr>
<tr height="30">
<td width="150" align="right" bgcolor="#E6E6E6">username</td>
<td width="300" bgcolor="#E6E6E6">
<input type="text" name="UserName" maxlength="20" size="15" /></td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">密碼</td>
<td bgcolor="#E6E6E6">
<input name="UserPass" type="password" size="15" maxlength="20" /></td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">反複密碼</td>
<td bgcolor="#E6E6E6">
<input name="UserPass" type="password" size="15" maxlength="20" /></td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">性别</td>
<td bgcolor="#E6E6E6">
<input name="sex" type="radio" value="男" checked="checked" />男
<input name="sex" type="radio" value="女" />女
</td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">愛好</td>
<td bgcolor="#E6E6E6">
<input name="like" type="checkbox" value="1" />足球
<input name="like" type="checkbox" value="2" />籃球
<input name="like" type="checkbox" value="3" />乒乓球
</td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">省份</td>
<td bgcolor="#E6E6E6">
<select name="province">
<option>陝西省</option>
<option>山東省</option>
<option>山西省</option>
<option>河北省</option>
<option>河南省</option>
<option>湖南省</option>
<option>湖北省</option>
<option>黑龍江省</option>
<option>其它</option>
</select>
</td>
</tr>
<tr height="30">
<td align="right" bgcolor="#E6E6E6">自我介紹</td>
<td bgcolor="#E6E6E6">
<textarea name="Intro" cols="40" rows="5" id="Intro"></textarea></td>
</tr>
<tr height="30">
<td align="center" colspan="2" bgcolor="#CCCCCC">
<input type="submit" name="send" value="送出" />
<input type="reset" name="reset" value="重置" />
</td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
![龍珠訓練營task04[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)