Blogger Information
Blog 23
fans 1
comment 1
visits 22888
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
3.19制作用户注册表单
潮涌学习php的博客
Original
692 people have browsed it

这一节课学习了表格和HTML表单,做了一个案例,不过因为时间关系,做的不是很好看。

我在做好这个,首先还画了个表格的图,还要熟悉表格标签和表单标签,这样才能写好它。

普通单行文本框:<input type="text" >

密码:<input type="password">

单选框:<input type="radio"> 

复选框:<input type="checkbox" name="">     name值必须一样

下拉选择:<select name=""> <option value="" selected=""></option></select> 

上传文件:type="file"

文本域:<textarea name="" rows="" cols=""></textarea>

提交按钮:<input type="submit">

代码如下:

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>3.19作业</title>
</head>
<body>
	<form action="" method="post">
		<table border="1" cellspacing="1" cellpadding="5" width="600" align="center">
			<tr><td align="center" colspan="4"><h4>简历提交</h4></td></tr>
			<tr>
				<td><label for="name">姓名:</label></td>
				<td ><input type="text" id="name" name="name" placeholder="请填写姓名"></td>
				<td colspan="2" rowspan="3">头像 <input type="file" name="photo" accept="images/*"></td>
			</tr>
			<tr>
				<td><label for="age">年龄:</label></td>
				<td><input type="text" id="age" name="age" placeholder="请填写年龄"></td>
			</tr>
			<tr>
				<td>性别:</td>
				<td>				
					<input type="radio" value="male" id="male"><label for="male">男</label>
					<input type="radio" value="female" id="female"><label for="female">女</label>
					<input type="radio" value="secrect" id="secrect"><label for="secrect">保密</label>
				</td>
			</tr>
			<tr>
				<td>技能:</td>
				<td align="center"><input type="checkbox" name="html[]" value="html" id="html"><label for="html">HTML</label></td>
				<td align="center"><input type="checkbox" name="php[]" value="php" id="php"><label for="php">PHP</label></td>
				<td align="center"><input type="checkbox" name="java[]" value="java" id="java"><label for="java">Java</label></td>	
			</tr>
			<tr>
				<td>水平:</td>
				<td align="center"><select name="level" id="">
					<option value="">小白</option>
					<option value="">中级</option>
					<option value="">大神</option>
				</select></td>
				<td align="center"><select name="level" id="">
					<option value="">小白</option>
					<option value="">中级</option>
					<option value="">大神</option>
				</select></td>
				<td align="center"><select name="level" id="">
					<option value="">小白</option>
					<option value="">中级</option>
					<option value="">大神</option>
				</select></td>
			</tr>
			<tr>
				<td>简介:</td>
				<td colspan="3"><textarea name="comment" id="" cols="70" rows="10"></textarea></td>
			</tr>
			<tr>
				<td>密码:</td>
				<td colspan="3" align="center"><input type="password"></td>
			</tr>
			<tr>
				<td colspan="2" align="center"><input type="submit" value="提交"></td>
				<td colspan="2" align="center"><input type="reset" value="重置"></td>
			</tr>
		</table>
	</form>
</body>
</html>

运行实例 »

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

3.19-1.jpg

3.19-2.jpg

3.19-3.jpg

Correction status:qualified

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!