HTML表格和表单
表格
1.表格的作用：
A.页面的布局
B.显示规则有序的数据
2.表格的写法
<table>
<tr>
<td|th>...</td|/th>
...
</tr>
...
</table>
说明：th只能用于第一行，用于设置列名，居中且加粗。
3.表格的属性（table）
width 宽度
height 高度
bgcolor 背景颜色
background 背景图像
border 边框宽度
bordercolor 边框颜色
align 水平对齐方式(left|center|right)
cellpadding 内边距(内容与框线之间的距离)
cellspacing 外边距(相邻单元格之间的距离)
<caption>表格标题</caption>:为表格设置标题，必须紧跟在<table>之后，每个表格只有1个标题。
4.行的属性（tr）
align 水平对齐方式(left|center|right)
valign 垂直的对齐方式(top|middle|bottom)
5.单元格的属性（td）
align 水平对齐方式(left|center|right)
valign 垂直的对齐方式(top|middle|bottom)
bgcolor 背景颜色
background 背景图像
rowspan 行合并的数目
colspan 列合并的数目
6.表格的边框设置
6.1 frame：用于处理表格外侧的边框，其属性的值有：
void：不显示任何边框
above：只显示顶部边框
below：只显示底部边框
hsides：只显示水平方向边框
visides：只显示垂直方向边框
lhs：只显示左侧边框
rhs：只显示右侧边框
box显示所有边框
border：显示所有边框（默认）
6.2rules：用于处理表格内侧的边框，其属性的值有：
none：不显示任何单元格之间的边框
groups：只在行编组或列编组之间显示边框
rows：只显示水平方向边框
cols：只显示垂直方向边框
all：显示所有单元格之间的边框（默认）
7.表格编组
7.1表格按行编组可分为：表头、表主体、表尾
<thead>表头</thead>:表头，每个表只有一个
<tbody>表头</tbody>:表内容，每个表可以有多个内容编组
<tfoot>表头</tfoot>:表尾，每个表只有一个
7.2表个按列编组
<colgroup>
<td>...</td>
...
</colgroup>
表单
1.表单的作用
收集客户端的信息，然后提交给服务器。
2.表单的标记
<form name="名称" action="服务器页面URL" method="提交方式(post|get)">
....
</form>
说明：
A.action指服务器页面URL，一般为动态类型的文件(如jsp,php等)
B.method指表单的提交方式
get 提交的字符数较少提交的数据以"名/值"对形式附加在URL地址栏。
post 提交的字符数理论上讲无限制 提交数据将由HTTP请求头部一起发送。
3.表单的控件(表单的元素)
3.1 说明：所有表单控件必须赋予含义明确的名称。否则服务器端取不出提交值
3.2 单行文本框
<input type="text" name="名称" value="值" size="显示宽度" maxlength="最大长度"/>
3.3 密码框
<input type="password" name="名称" value="值" size="显示宽度" maxlength="最大长度"/>
3.4 单选框
<input type="radio" name="名称" value="值" checked="checked"/>
说明：
A.一组类型的单选框名称必须相同
B.必须为单选框赋予有效提交值
C.checked是用来设置默认选项的
3.5 复选框
<input type="checkbox" name="名称" value="值" checked="checked"/>
说明：
A.一组类型的复选框名称必须相同
B.必须为复选框赋予有效提交值
3.6 按钮
提交按钮
<input type="submit" value="值" name="名称"/>
取消按钮
<input type="reset" value="值" name="名称"/>
自定义按钮(其行为由js控制)
<input type="button" value="值" name="名称"/>
3.7下拉列表框
<select name="名称" size="显示高度" multiple="multiple">
<optgroup label="分组名称">
<option value="值" selected="selected">....</option>
...
</optgroup>
...
</select>
说明：
A.multiple="multiple"属性可以控制是否多选。
B.必须为列表项赋予有效提交值。
C.selected=”selected”用来设置默认选项。
D.在分组时，IE浏览器显示的字体加粗且倾斜，其他浏览器只加粗。
3.8多行文本框
<textarea name="名称" rows="行数" cols="列数" wrap=”换行处理方式” readonly=”readonly”>
文本内容
</textarea>
说明：
A.wrap属性有3个值，virtual、physical、off
B.virtual表示将文本框中的内容做换行处理，但会作为一个整体发送。
C.physical表示录入的文本会折叠，发送时也一样。
D.off表示文本并不换行，发送时按照输入的样子发送（默认）
E.readonly属性指定文本只读，用户无法修改初始内容，但可以进行第一次内容填写，之后该效果才生效。
3.9 隐藏域
<input type="hidden" name="名称" value="值"/>
说明：隐藏域提交正确但无需用户干涉的信息。
3.10浏览框（文件上传框）
<input type="file" name="名称" size=”框的大小” accept=”文件类型”/>
说明：
A.具有浏览框的表单，其提交方式只能为post
B.具有浏览框的表单，必须设置enctype="multipart/form-data"属性
C.accept属性用于限制长传的文件类型，如：accept=”image/gif”,只允许上传gif格式的图像文件。
3.11图像按钮
<input type=”image” src=”图像URL” height=”图像高度” width=”图像宽度” alt=”注释” border=”value”/>
4.访问控制
A.acceskey=”value”可实现快捷键的设置
B.disable属性禁用表单元素，被禁用的元素将不被提交
C.readonly属性在表单提交后，禁止用户修改
D.title属性可以为用户提供提示信息
5.实现表单中选择框点击文字也能选择
<input type=”checkbox|radio” name=”名称” value=”值” checked=”checked” id=”标记符号”/>
<label for=”标记符号” >文本</label>
说明：id只用于标识文本，具有唯一性，不可重复。
6.控件分组
一般情况下我们应当为控件分组，使文档内容更美观紧凑。
<fieldset>控件</fielset>:为控件分组，在一组窗口部件外面建立一个边框。