HTNL 表格，表单-CFANZ编程社区

一，表格区域的划分

    <table>
        <!-- 标题 -->
        <caption></caption>
        <!-- 表头 -->
        <thead></thead>
        <!-- 内容 -->
        <tbody></tbody>
        <!-- 表脚 -->
        <tfoot></tfoot>
    </table>

表格区域划分后，按照划分的内容，表格内的部分不论写在表格哪个位置，都将出现的固定的位置。

例如：如果将标题写在tbody后，标题依然会出现在最上方。

注：火狐浏览器只能显示一个标题，而其他浏览器可以显示多个标题，这就是兼容性问题。

表格嵌套关系：table>thead|tbody>tr>th|td ，caption标签必须写在table之后。

二，表单

1.form标签

form标签，创建表单，是一个功能性标签，并不是一个结构化标签，用来收集用户的数据，提交到相对应的地点。

属性：

action：提交数据的地址
name：定义表单的名称
target：页面打开方式
method：数据提交方式，如：get，post

注：表单还有许多控件：textarea 多行文本域，多行文本输入框

select 下拉列表

input 输入框

button 按钮

2.textarea标签

rows：设置行高 name：收集的数据

cols：设置列宽 id：标签唯一属性

表示：出现滚动条后，只显示列宽和行高数值的字符，例：rows=4 cols=10表示出现滚动条后只显示4行每行10个字符的内容，看其他内容需要拖动滚动条。

3.label标签

<label for=""></label>

label中的for属性，可将不在表单的东西与表单联系起来。

在的html5中label内允许添加标签，因此就不用for就可连接了。

<label>信息 
    <textarea name="mad" id="" cols="30" rows="10"></textarea>
</label>

4.select标签

属性：multiple 多选标签 size：显示在页面的列表的项数

option：用来定义下拉列表的一个项的名称。

optgroup：定义选项组。 label为选项组描述。

注：option的内容只能是文本不能是标签。

5.input标签

input是一个但标签

type属性：

text 文本输入框（默认值）

password 密码框文本输入框与密码框name必须一致

radio 单选框

checkbox 多选框 checked布尔值，默认被选中

注：单选和复选框name值必须一致，这样才能保证是同一个题干下面的不同选项

file 文件

accept 设置文件的类型

multiple 设置多选

hidden 不需要用户输入隐藏文本域

button 普通按钮

submit 提交按钮

reset 重置按钮

image 图片提交按钮

src 设置图片的路径 width 与 height 设置图片的宽度和高度

6.button标签

type 规定按钮的类型（button，reset，submit）

7.表单控件的通用属性

name 规定文本区的名称。
value 定义送往服务器的选项值（表单控件的值）。
autofocus 规定在页面加载后文本区域自动获得焦点（html5新增）。
form 规定文本区域所属的一个或多个表单（html5新增）。
placeholder 规定描述文本区域预期值的简短提示（html5新增）。
disabled 规定禁用该文本区。
readonly 规定文本区为只读。
maxlength | minlength 规定文本区域的最大|最小字符数（textarea 与 input）。
required 规定文本区域是必填的（textarea 与 input）（html5新增）。