1+X考试课程（二）HTML表单
- 表格
- 创建表格
- 表格属性
- 表格结构
- 表格标题
- 合并单元格
- 总结
- 表单
- input控件
- label标签
- textarea标签
- 下拉菜单
- 表单域
表格
创建表格
单元格内的文字
...
...
| 标签 | 作用 |
|---|---|
<table> |
注意：
1.tr中只能嵌套td。
2.td下可以有任意元素。
表格属性
| 属性名 | 含义 | 常用属性值 |
|---|---|---|
| border | 设置表格的边框（默认border="0"无边框） |
像素值 |
| cellspacing | 设置单元格与单元格边框之间的空白间距 | 像素值（默认2像素） |
| cellpadding | 设置单元格内容与单元格边框之间的空白间距 | 像素值 |
| width | 设置表格的宽度 | 像素值 |
| height | 设置表格的高度 | 像素值 |
| align | 设置表格在网页中的水平对齐方式 | left、center、right |
表格结构
：头部，必须位于
：主体。
标题111
标题222
标题333
内容111
内容222
内容333
内容111
内容222
内容333
表格标题
标题
caption标签必须紧随table标签之后，每个表格只能定义一个标题，且居中于表格之上。
合并单元格
代码：
完整样式
1
2
3
4
5
6
跨列合并
1
colspan跨列合并
4
5
6
跨行合并
1
2
rowspan跨行合并
4
5
思想：多个内容合并时，将多余的东西删除。
公式：删除的个数 = 合并的个数 - 1。
合并的顺序：先上、先左。
总结
1.表格提供了HTML中定义表格式数据的方法。
2.表格中由 行 中的单元格组成。
3.表格中没有列元素，列的个数取决于行的单元格个数。
表单
完整表单通常由：表单控件 、提示信息 、表单域 三个部分构成。
表单控件：包含了具体的表单功能项。
提示信息：说明性文字，提示用户进行填写和操作。
表单域：容纳所有的表单控件和提示信息，定义处理表单数据所有程序的url地址，以及数据提交到服务器的方法。
input控件
| 属性 | 属性值 | 描述 |
|---|---|---|
| type | text | 单行文本输入框 |
| password | 密码输入框 | |
| radio | 单选按钮 | |
| checkbox | 复选框 | |
| button | 普通按钮 | |
| submit | 提交按钮 | |
| reset | 重置按钮 | |
| image | 图像形式的提交按钮 | |
| file | 文件域 | |
| name | 由用户自定义 | 控件的名称 |
| value | 由用户自定义 | input控件中的默认文本值 |
| size | 正整数 | input控件在页面中的显示宽度 |
| checked | checked | 定义选择控件默认被选中的项 |
| maxlength | 正整数 | 控件允许输入的最多字符数 |
label标签
作用：用于绑定一个表单元素，当点击label标签的时候，被绑定的表单元素就会获得输入焦点。
通过 id 绑定表单元素。
textarea标签
需要输入大量的信息时，textarea控件创建多行文本输入框。
例子
结果
一个汉字 = 两个字符。
下拉菜单
例子
结果
注意：
1.中必须含有一对。
2.在option中定义selected="selected"时，当前选项为默认选中项。
表单域
在HTML中，form标签被用于定义表单域，即创建一个表单，来实现用户信息的收集和传递。
| 常用属性 | 作用 |
|---|---|
| action | 指定接收并处理表单数据的服务器程序的url地址 |
| method | 设置表单数据的提交方式，取值为get或post |
| name | 指定表单的名称，以区分同一个页面中的多个表单 |