表单的作用:用于向服务器发送数据。
(也可以通过超链接后面拼接参数的形式向服务器发送数据)
表单标签
<form action="指定表单的提交地址" method="GET/POST"></form>
表单项标签
input
文本输入框<input type="text" placeholder="请输入用户名" name="username"/>
密码输入框<input type="password" placeholder="请输入密码" name="pwd"/>
单选框<input type="radio" name="sex" value="male"/
复选框<input type="checkbox" name="hobby" value="wq"/>
普通按钮<input type="button" value="确定"/>
提交按钮<input type="submit" value="注册"/>
重置按钮<input type="reset" value="重置"/>
文件上传项<input type="file"/>
隐藏域<input type="hidden"/>
select/option
<select name="city">
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="gz">广州</option>
</select>
textarea
<textarea rows="10" cols="100" placeholder="请输入..." name="desc"></textarea>
如果表单项中的数据需要被提交,表单项必须指定name属性(参数名称),否则将不被提交
Input中,type如果是radio或者checkbox的话,不配置value属性,默认提交on
<!DOCTYPE html>
<html>
<head>
<title>表格标签</title>
<meta charset="utf-8"/>
</head>
<body>
<h1 align="center">注册表单</h1>
<form action="#" method="GET">
<table align="center" border="1" bordercolor="pink" bgcolor="lightgray" cellspacing="0" width="80%" height="500px">
<tr><td>用户名:</td><td><input type="text" placeholder="请输入用户名" name="username"/></td></tr>
<tr><td>密码:</td><td><input type="password" placeholder="请输入密码" name="pwd"/></td></tr>
<tr><td>确认密码:</td><td><input type="password" placeholder="请再次输入密码" name="repwd"/></td></tr>
<tr><td>昵称:</td><td><input type="text" placeholder="请输入昵称" name="nick"/></td></tr>
<tr><td>性别:</td><td><input type="radio" name="sex" value="male"/>男<input type="radio" name="sex" value="female"/>女</td></tr>
<tr><td>爱好:</td><td><input type="checkbox" name="hobby" value="lq"/>篮球<input type="checkbox" name="hobby" value="zq"/>
足球<input type="checkbox" name="hobby" value="wq"/>网球</td></tr>
<tr><td>出生地:</td>
<td><select name="city"><option value="bj">北京</option><option value="sh">上海</option><option value="gz">广州</option></select></td></tr>
<tr><td>头像:</td><td><input type="file" name="photo"></td></tr>
<tr><td>个人描述:</td><td><textarea rows="10" cols="100" placeholder="请输入..." name="desc"></textarea></td></tr>
<tr><td>验证码:</td><td><input type="text" placeholder="请输入验证码" name="validate"/></td></tr>
<tr><td colspan="2" align="center"><input type="submit" value="注册"/><input type="reset" value="重置"/></td></tr>
</table>
</form>
</body>
</html>