Blogger Information
Blog 7
fans 0
comment 0
visits 4284
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
319作业
漫云的博客
Original
610 people have browsed it

实例3191.jpg3192.jpg

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>3-2实战1:用表格布局来实现用户注册表单</title>
</head>
<body>
	<!-- 这个案例中,我们还要学员几个新标签,<label><fieldset><legend> -->
				
		<form action="" method="post">
		<table border="0" cellspacing="0" cellpadding="8" align="center" width="400" bgcolor="powderblue">
			<caption><h2>用户注册</h2></caption>	
			<tr><td colspan="2"><hr></td></tr>  <!-- 此行代码就是画一条分隔线没有其它用处 -->
			<tr align="center">
				<td align="right" width="60"><label for="name">邮箱:</label></td>
				<td align="left" width="300"><input type="text" id="name" name="name" value="" placeholder="example@mail.com" size="30" width="200"></td>
			</tr>

			<tr align="center">
				<td align="right"><label for="password">密码:</label></td>
				<td align="left"><input type="text" id="password" name="name" value="" placeholder="字母+数字不少于10位" size="30"></td>
			</tr>
			
			<tr align="center">  <!-- 如何设置label标签,点击时会导致第一个控件被选中 -->
				<td align="right">性别:</td> <!-- 不需要进入焦点 -->
				<td align="left">
					<input type="radio"  name="sex" value="male">男
					<input type="radio"  name="sex" value="female">女
					<input type="radio"  name="sex" value="secret" checked="">保密
				</td>
			</tr>

			<tr align="center">
				<td align="right">兴趣:</td>   <!-- 不需要进入焦点 -->
				<td align="left">
					<input type="checkbox" name="happy[]" value="html">足球
					<input type="checkbox" name="happy[]" value="css">篮球
					<input type="checkbox" name="happy[]" value="javascript">排球
					<input type="checkbox" name="happy[]" value="php" checked="">乒乓球
				</td>
			</tr>

			<!-- tr[align="center"]>(td>label[for="level"]{级别:}+td>select[id="level" name="level"]>option[value=""]*3) -->
			<tr align="center">
				<td align="right"><label for="level">级别:</label></td>
				<td align="left">
					<select name="level" id="level">
						<option value="">只是爱好</option>
						<option value="" selected="">经常打球</option>
						<option value="">参加过学校球队</option>
						<option value="">经常参加比赛</option>
					</select>
				</td>
			</tr>
			
			<tr align="center">
				<td align="right"><label for="photo">头像:</label></td>
				<td align="left">
					<img src="../images/12.png" height="30">
					<input type="file" id="" name="photo" accept="image/*">
				</td>
			</tr>

			<tr align="center">
				<td valign="middle" align="right"><label>简介:</label></td>
				<td align="left"><textarea name="comment" id="comment" rows="5" cols="40" placeholder="服从教练,团结协作"></textarea></td>
			</tr>
			
			<tr>
				<td colspan="2" align="center">
					<hr>
					<input type="submit" name="submit" value="提交">
					    
					<input type="reset" name="reset" value="重填">
				</td>
			</tr>

		</table>
		</form>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


Correction status:Uncorrected

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!