简单的表单示例

简历表单

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h3 align="center">个人简历</h3>
		<table border="1" align="center" cellspacing="0">
			<tr>
				<td align="center"  height="30" bgcolor="deepskyblue">姓名</td>
				<td width="100"></td>
				<td align="center" width="100"bgcolor="deepskyblue">性别</td>
				<td></td>
				<td rowspan="5" width="100" align="center">照片</td>
			</tr>
			<tr>
				<td align="center" height="30"bgcolor="deepskyblue">出生年月</td>
				<td></td>
				<td align="center"bgcolor="deepskyblue">籍贯</td>
				<td></td>
			</tr>
			<tr>
				<td align="center" height="30"bgcolor="deepskyblue">政治面貌</td>
				<td></td>
				<td align="center"bgcolor="deepskyblue">民族</td>
				<td></td>
				
			</tr>
			<tr>
				<td align="center"height="30"bgcolor="deepskyblue">健康状况</td>
				<td></td>
				<td align="center"bgcolor="deepskyblue">婚姻状况</td>
				<td></td>
				
			</tr>
			<tr>
				<td align="center"height="30"bgcolor="deepskyblue">联系电话</td>
				<td></td>
				<td align="center" align="center"height="30"bgcolor="deepskyblue">电子邮箱</td>
				<td width="100" align="center"><font size="1">www.jinjin.com</font></td>
				
			</tr>
			<tr>
				<td align="center"height="30"bgcolor="deepskyblue">求职意向</td>
				<td colspan="4"></td>
			</tr>
			<tr>
				<td align="center" height="200"bgcolor="deepskyblue">工作经历</td>
				<td colspan="4"></td>
			</tr>
			<tr>
				<td align="center" height="40"bgcolor="deepskyblue">教育经历</td>
				<td colspan="4"></td>
			</tr>
			<tr>
				<td align="center" height="40"bgcolor="deepskyblue">英文水平</td>
				<td colspan="4"></td>
			</tr>
			<tr>
				<td align="center" height="40"bgcolor="deepskyblue">计算机水平</td>
				<td colspan="4"></td>
			</tr>
			<tr>
				<td align="center" height="40"bgcolor="deepskyblue">自我评价</td>
				<td colspan="4"></td>
				
			</tr>
		</table>
	</body>
</html>

运行图示:
在这里插入图片描述

注册表单

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form>
			<table border="0" cellspacing="0" cellpadding="0" align="center"
			bgcolor="lightskyblue">
				<tr bgcolor="dodgerblue">
					<td colspan="2" align="center">欢迎注册</td>
					
				</tr>
				<tr>
					<td><label for="n1">用户名:</label></td>
					<td><input type="text" id="n1"/></td>
				</tr>
				<tr>
					<td><label for="pw">密码:</label></td>
					<td><input type="password" id="kw"/></td>
				</tr>
				<tr>
					<td>性别:</td>
					<td><input type="radio" name="sex"
					      value="" checked="checked"
						  id="mid"/><label for="mid"></label>
					<input type="radio" name="sex" value=""
					      id="wmid"/><label for="wmid"></label></td>
				</tr>
				<tr>
					<td><label for="tp">电话:</label></td>
					<td><input type="text" id="tp"/></td>
				</tr>
				<tr>
					<td><label for="pf">职业:</label></td>
					<td><select name="profession" id="pf">
					<option value="100" selected="selected">请选择</option>
					<option value="200">老师</option>
					<option value="300">学生</option>
					<option value="400">家长</option>
					</select></td>
				</tr>
				<tr>
					<td><label for="hobby">爱好:</label></td>
					<td><input type="checkbox" name="sub" value="敲代码" id="sub"/>
					    <label for="sub">敲代码</label>
						<input type="checkbox" name="sub" value="打游戏"id="s2" />
						<label for="s2">打游戏</label>
						<input type="checkbox" name="sub" value="唱歌"id="s3" />
						<label for="s3">唱歌</label>
						<input type="checkbox" name="sub" value="运动"id="s4" />
						<label for="s4">运动</label>
					</td>
				</tr>
				<tr>
					<td><label for="ad">地址:</label></td>
					<td><textarea name="address" rows="3" cols=""></textarea></td>
				</tr>
				<tr bgcolor="dodgerblue">
					<td colspan="2" align="center">填写完成后点击下面提交按钮提交表单</td>
				</tr>
				<tr>
					<td colspan="2" align="center">
						<input type="submit"/>
						<input type="reset" />
					</td>
				</tr>
			</table>
		</form>
	</body>
</html>

运行图示:
在这里插入图片描述

3.简单淘宝注册

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form>
			<table border="0" cellpadding="0" cellspacing="0" align="center">
				<tr>
					<td><img src="img/logo.gif"/></td>
					<td><img src="img/reg.gif"/></td>

				</tr>
				<tr>
					<td><label for="id">姓名:</label></td>
					<td><input type="text" id="id"/></td>
				</tr>
				<tr>
					<td><label for="idc">登录名:</label></td>
					<td><input type="text" id="idc"/>(可包含a-z,0-9和下划线)</td>
				</tr>
				<tr>
					<td><label for="pd">密码:</label></td>
					<td><input type="password" id="pd"/>(至少包含6个字符)</td>
				</tr>
				<tr>
					<td><label for="cpw">确认密码:</label></td>
					<td><input type="password" id="cpw"/></td>
				</tr>
				<tr>
					<td>性别:</td>
					<td><input type="radio" name="sex" value=""
					     id="s1" checked="checked"/><label for="s1">
					     <img src="img/Male.gif"/></label>
					    <input type="radio" name="sex" value=""
					         id="s2" /><label for="s2">
					         <img src="img/Female.gif"/></label>
					</td>
				</tr>
				<tr>
					<td>爱好:</td>
					<td><input type="checkbox" name="hobby" value="运动" id="h1"/>
					      <label for="h1">运动</label>
						<input type="checkbox" name="hobby" value="聊天" id="h2"/>
						      <label for="h2">聊天</label>
						<input type="checkbox" name="hobby" value="玩游戏" id="h3"/>
						      <label for="h3">玩游戏</label>	  
				    </td>
				</tr>
				<tr>
					<td>职业:</td>
					<td><select name="profession">
					         <option value="程序员">程序员</option>
							 <option value="演员">演员</option>
							 <option value="作家">作家</option>
					    </select>
					</td>
				</tr>
				<tr>
					<td colspan="2"><img src="img/edit.jpg"/>阅读淘宝服务协议</td>
					
				</tr> 
				<tr>
					<td colspan="2"><textarea name="agreement"rows="6"cols="82">欢迎阅读服务条款协议,本协议阐述之条款和条件适用于您适用taobao.com网站的各种工具和服务.
					                                                            本服务协议双方位淘宝与淘宝用户,本服务协议具有合同效力.
																				淘宝的权利和义务
																				1.淘宝有义务在现有技术上维护整个网络交易平台的正常运行,并努力提升技术和改进技术,使用户网上交易顺利进行
					                </textarea>
					</td>
				</tr>
				<tr>
					<td colspan="2"><input type="checkbox" id="it"/>
					                <label for="it">已阅读条款</label>
					</td>
				</tr>
				<tr>
					<td colspan="2"><input type="reset" value="重填"/>
					                <input type="submit"value="提交注册信息"/>
					</td>
				</tr>
			</table>
		</form>
	</body>
</html>

运行图示;
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_45866940/article/details/109261292