1.语法:<form>
表单元素
</form>
表单本身不可见
表单元素有文本域，单选框，复选框，按钮，列表等
form标签中，以下标签实现单元素添加
<input>表单输入标签
<select>下拉菜单，列表标签
<option>下拉菜单，列表项目标签
<textarea>文字域标签
<optgroup>下拉菜单，列表项目分组标签
<input>标签单标记
语法:
<input type="类型属性" name="名称".../>
type属性:
text 文字域
password密码域
file文件域
checkbox复选框
radio单选框
button按钮
submit提交按钮
reset重置按钮
hidden隐藏域
image图像域
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html";charset=utf-8"/>
<title>基础表单<html>
</head>
<body>
<h1 align="center">注册信息</h1>
<hr color=#336699"/>
<form>
<table width="600px" bgcolor="#f2f2f2" align="center">
2.单行文本域
<input type="text name="..."/>
属性
name 文字域名称
maxlength用户输入的最大字符长度
size文本框的宽度
value指定文本框的默认值
placeholder规定用户填写输入字段的提示
<tr>
<td>姓名</td>
<td><input type="text" name="username" size="25" maxlength="6" placeholder="请输入姓名"/></td>
</tr>
3.密码框
<input type="password" name=" " />
密码域也是文本域的形式
<tr>
<td>邮箱:</td>
<td><input type="text" name="email" value="@163.com"/></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="paw" size="25" maxlength="6" placeholder="请输入密码"/></td>
</tr>
<tr>
<td>确认密码</td>
<td><input="password" name="paw_confirm" size="25" maxlength="6" placeholder="请再输入密码"/></td>
</tr>
4.文件域
<input type="file" name="..."/>
<tr>
<td>上传照片</td>
<td><input type="file" /></td>
</tr>
5.单选框
<input type="radio" name="..." value="..." checked/>//checked为默认
<tr>
<td>性别</td>
<td>男<input type="radio" name="sex" value="man"/ >
<td>女<input type="radio" name="sex" value="woman"/ > </td>
</tr>
6.复选框
<input type="checkbox" />
<tr>
<td>爱好的运动</td>
<td>跑步<input type="checkbox" name="dx1" value="read" checked/>
跳舞<input type="checkbox" name="dx1" value="dance" />
唱歌<input type="checkbox" name="dx1" value="sing" /></td>
</tr>
7.按钮
<input type="button" name="..." value="..."/>
<input type="submit" name="..." value="..."/>
<input type="reset" name="..." value="..."/>
<tr>
<td><input type="buttton" value="来点我" name="button"/>
<input type="submit" value="submit" name="submit"/>
<input type="reset" value="reset" name="reset"/></td>
</tr>
8.图像域
<input type="image" name="..." src="imageurl"/>
<input type="image" name="image_button" src="image/image-button.png"/>
9.隐藏域
有些信息不想让用户看到但要传给服务器
<input type="hidden" name="..." value="..."/>
<tr>
<td><input="hidden" name="hidden" value="这是一个用户注册信息"/></td>
</tr>
10.下拉菜单，列表标签
可节约空间
11.select属性
name设置下拉菜单和列表名称
multiple设置可选择多个选项
size设置列表中可见项目的数目
12option属性
selected设置选项初始选中状态
value定义送往服务器的选项值
<tr>
<td>城市</td>
<td>
<select>
<option value="bj" selected>北京</option>
<option value="hb" selected>河北</option>
<option value="sh" selected>上海</option>
</selected>
</td>
</tr>
13label分组
<select name="...">
<optgroup label="组一">
<option value="...">选项</option>
<option value="...">选项</option>
<option value="...">选项</option>
</optgroup>
<optgroup label="组二">
<option value="...">选项</option>
<option value="...">选项</option>
<option value="...">选项</option>
</optgroup>
</select>
<select name="city">
<optgroup label="华北">
<option value="tj">天津</option>
<option value="jl">吉林</option>
<option value="bj">北京</option>
</optgroup>
<optgroup label="华东">
<option value="sh">上海</option>
<option value="js">江苏</option>
<option value="hn">湖南</option>
</optgroup>
</select>
13.textarea多行文本域
属性
name设置文本区名称
placeholder设置文本域提示
rows设置文本域的可见行数
cols设置文本域的可见宽度
<textarea name="..." rows="..." cols="...">
<tr>
<td>简介</td>
<td><textarea name="jj" rows="6" cols="50" placeholder
="请输入个人信息">...</textarea>
14表单页面调整
form标签
<form action="..." method="..." name="...">
</form>
form属性
action url 提交时向何处发送
method get.post 何种形式发送
name form_name 表单名称
target _blank，._self，_parent 在何处打开action url
enctype .application/x_www_form_urlencoded
multipart/form_data
text/plain
在发送表单数据之前如何对其进行编码
14get post
get
使用url传递参数
对发送信息的数量有限制
一般用于信息获取保密性差
post
表单数据作为http请求体一部分
对发送信息的数量无限制
一般用于修改服务器上的资源保密性好
