html中表格及表单

HTML中的表格及表单

目录

HTML中的表格及表单

table标签:

form表单：

---

table标签:

table标签用来定义HTML表格

使用场合：有规律的数据（大量数据显示/查询，不推荐使用）

简单的表格由table元素及多个或者一个 tr、td、th元素组成。

其中tr定义其中表格的行，td定义表格的列，th定义表格的表头（一般文本加粗显示）。

table一些的属性：

• border ：定义表格的边框线
• cellspacing ：定义表格中单元格之间的空白。（也可说是单元格与单元格之间的间隙）
• cellpadding：定义表格中单元格边沿与其内容之间的空白。（也可以说是单元格中的内容与单元格边框之间的距离）
• align ：定义表格的对齐方式。（一般不建议使用，可以用样式代替）
• bgcolor：定义表格的背景颜色。（一般不建议使用，可以用样式代替）
• width：定义表格的宽度。

tr/td的一些属性：

• align ：规定单元格中内容的水平对齐方式。
• vaglin：规定单元格中内容的垂直对齐方式。
• bgcolor：定义单元格的背景颜色。
• colspan：定义单元格跨行。
• rowspan：定义单元格跨列。
• height  width  等等

<cacption></caption> ：规定表格的标题（每个表格有且仅有一个）

table的复杂应用

<thead></thead>   <tbody></tbody>  <tfoot></tfoot>

三组元素可以对表格中的行进行分组。（如果使用其中一个标签的的话，就必须使用全部元素，他们出现的次序：thead  tbody tfoot 当你改变次序时，浏览器渲染不变）。

form表单：

其作用：用于收集或者显示用户信息并将信息提交给服务器。

一个完整的表单由：

1.表单元素：负责将用户信息提交给服务器

• action ：规定当提交表单时向什么地方发送表单数据
• method：向服务器端传送数据时使用 

post：隐式提交———所有数据会打包提交，用户不会再浏览器的地址栏上看到相关信息，相对而言较安全

get：显示提交———表单的数据会显示在浏览器的地址栏，提交的数据长度有限制

• enctype ：设置表单的编码格式。

2.表单控件：负责接收用户的数据。

  a. input组 ：它们的共同属性有：type 的属性值有：text（文本框） button（按钮） submit（提交）reset（重置）password（密码）tel（电话）email（电子邮箱）radio（单选按钮）CheckBox（复选按钮）等等、value、name（控件名称，在表单提交时必须写其名称） placeholder（占位符）等等

 b.textarea 文本域 ：定义多行的文本输入。

属性有rows （规定高度） cols（规定宽度）

c.选择框  ：select option

其中option有一个属性selected（默认选中）

d.其他元素 ：disabled (禁用控件)   

fieldset元素 ：可将表单内的相关元素分组。

<fieldset>标签将表单内容的一部分打包，生成一组相关表单的字段，它没有必需的或者唯一的属性。常与<legend>搭配使用。