HTML标签之表格和表单元素
1.表格标签
- 表格由
<table>标签来定义；- 每个表格均有若干行（由
<tr>标签定义）- 每行被分割为若干单元格（由
<td>标签定义）- 字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等
表格Table
- HTML表格表头: 表格的表头使用标签进行定义；大多数浏览器会把表头显示为粗体居中的文本。
- HTML带有标题的表格: 表格的标题用caption表示
- colspan 属性规定单元格可横跨的列数
- rowspan 属性规定单元格可横跨的行数
- 单元格边距(Cell padding) : cellpadding
- 单元格间距(Cell spacing): cellspacing
表格样式重置> - table{ border-collapse：collapse} 单元格间隙合并
- th，td{ padding: 0} 重置单元格默认填充
2.表格属性
table-layout:
- 设置或检索表格的布局算法
- auto： 默认的自动算法。布局将基于各单元格的内容，换言之，可能你给某个单元格定义宽度为100px，但结果可能并不是100px。表格在每一单元格读取计算之后才会显示出来，速度很慢;
- fixed： 固定布局的算法。在这算法中，水平布局是仅仅基于表格的宽度，表格边框的宽度，单元格间距，列的宽度，而和表格内容无关。也就是说，内容可能被裁切;
border-collapse：
- 设置或检索表格的行和单元格的边是合并还是独立
- separate： 边框独立
- collapse： 相邻边被合并
- 注意: 只有当表格边框独立(即border-collapse属性等于separate时，border-spacing属性才起作用)
border-spacing：
- 设置或检索当表格边框独立时，行和单元格的边框在横向和纵向上的间距
- 该属性作用等同于标签属性cellspacing(单元格边距)。border-spacing:0等同于cellspacing=”0”
- 只有当表格边框独立（即 border-collapse 属性等于separate时）此属性才起作用。
- 如果提供全部两个length值时，第一个作用于横向间距，第二个作用于纵向间距。
- 如果只提供一个length值时，这个值将作用于横向和纵向上的间距。
caption-side：
- 设置或检索表格的caption对象是在表格的那一边
- top：指定caption在表格上边
- bottom： 指定caption在表格下边
empty-cells:
- 设置或检索当表格的单元格无内容时，是否显示该单元格的边框
- hide: 指定当表格的单元格无内容时，隐藏该单元格的边框
- show: 指定当表格的单元格无内容时，显示该单元格的边框
- IE7及以下浏览器只默认隐藏无内容的单元格边框，要想使其获得与show参数值相同的效果，可以变相给该空单元格加个占位且不可见的元素，例如全角空格或 等等
2.表单标签
HTML 表单用于搜集不同类型的用户输入;
- 表单是一个包含表单元素的区域。
- 表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。
- 表单使用表单标签
<form>来设置input标签
input> 标签规定了用户可以在其中输入数据的输入字段。 ><input>元素在<form>元素中使用，用来声明允许用户输入数据的 input 控件。 > 输入类型是由类型属性（type）定义的;
- 文本域（Text Fields）
- 密码字段
- 单选按钮（Radio Buttons）
- 复选框（Checkboxes）
- 提交按钮(Submit Button)
- 重置按钮(Reset Button)
- Button按钮(Button类型)
label标签
- label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上;-
提示: for 属性可把 label 绑定到另外一个元素。请把 for 属性的值设置为相关元素的 id 属性的值
select下拉列表>
- select 元素定义下拉列表
- option 元素定义待选择的选项, 列表通常会把首个选项显示为被选选项
textarea文本域
- textarea 元素定义多行输入字段（文本域）;
- rows 规定文本区域内可见的行数;
- cols 规定文本区域内可见的宽度;
button可点击按钮
- button 元素定义可点击的按钮
3.表单属性
value属性:
- value属性规定输入字段的初始值
readonly属性：
- readonly 属性规定输入字段为只读（不能修改）
disabled属性:
- disabled 属性规定输入字段是禁用的。 被禁用的元素是不可用和不可点击的。 被禁用的元素不会被提交
size属性:
- size 属性规定输入字段的尺寸（以字符计）
maxlength属性
- maxlength 属性规定输入字段允许的最大长度
autofocus属性
- autofocus是布尔属性。 如果设置，则规定当页面加载时
<input>元素应该自动获得焦点placeholder属性
- placeholder 属性规定用以描述输入字段预期值的提示（样本值或有关格式的简短描述）。
- 该提示会在用户输入值之前显示在输入字段中。
- placeholder 属性适用于以下输入类型：text、search、url、tel、email 以及 password’
required属性
- required 属性是布尔属性。
- 如果设置，则规定在提交表单之前必须填写输入字段。
- required 属性适用于以下输入类型：text、search、url、tel、email、password、date pickers、number、checkbox、radio、and file`
4.表格实例
- 可以自己找个表单写一下
