单元格合并涉及表格结构的调整

1. 跨列合并

属性 : colspan

取值 : 无单位的数值,表示跨几列

2. 跨行合并

属性 : rowspan

取值 : 无单位的数值,表示跨几行

注意 :

1. 跨行和跨列是单元格的操作,所以属性是单元格td的

属性

2. 一旦发生单元格合并,要删除多余的单元格:

跨列合并 :

影响当前行中单元格的数量,删除当前行中多余单元格

跨行合并 :

影响其后行中的单元格数量,需要删除后面行中多余的

单元格

4. 表格行分组

表格在浏览器中渲染时,会自动添加结构标签

表格可以分为 thead tfoot tbody 三部分

1. thead

标签用来划分表头

表头中可以有若干行组成

2. tfoot

用于划分表尾,由若干行组成

3. tbody

表示表格主体,默认情况下,所有的行

会自动加入tbody

注意 :

如果涉及在HTML代码中完整书写行分组标签,建议按照

顺序书写

3. 表单

1. 用来接收用户输入的数据并且提交给服务器

表单二要素

1. 表单元素

2. 表单控件

提供一系列可视化的组件,能够实现跟用户的交互

例如 : 输入框,按钮,文件上传等

2. 表单元素

1. 标签 :

用来提交数据到服务器,表单控件都应书写在form标签中

2. 标签属性

1. method

用来设置数据提交方式,取值 get / post

默认是get请求方式提交

get 请求 :

1. 数据会以参数的形式拼接在url后面

2. 安全性较低

3. 最大提交数据2kb

post 请求:

1. 数据会打包在请求头中,隐式提交

2. 安全性较高

3. 没有数据大小限制

2. action

必填,指定数据的提交地址

3. enctype

指定数据的编码方式,表单提供的编码类型有 :

1. application/x-www-form-urlencoded(默认)

将表单中的数据转换成字符串格式(name=zhangsan

&pwd=123456),附加在url后面,使用?与url隔开

2. multipart/form-data

专门用来上传特殊类型数据的,例如图片,文件,mp3

数据的提交方式必须是post

3. text/plain

数据以纯文本形式编码,不含任何控件和格式字符

3. 表单控件(重点)

1. 表单控件的数据只有放在表单元素中才可以被提交

2. 分类

1. 文本框和密码框

1. 语法 :

文本框

密码框

标签属性 :

1. type 指定控件类型

2. name 指定控件名称,缺少的话无法提交

3. value 指定控件的值,可以通过JS获取

4. maxlength 指定最大输入字符数

5. placeholder 设置提示文本

6. autocomplete 设置是否自动补全

2. 单选按钮和复选框

1. 语法 :

单选钮 :

复选框 :

2. 标签属性

1. name :

1. 定义控件名称

2. 一组的按钮控件名称必须保持一致,实现单选

2. value :

定义控件的值,最终将发送给服务器,按钮的value

属性必须指定

3. checked

表示选中当前按钮

3. 特殊用法 label for id

将按钮文本与按钮控件绑定在一起,实现点击文本与

点击控件等价的效果

使用 :

1. 使用标签包括按钮文本

2. 为按钮控件添加id属性,属性值自定义

3. 为label标签添加for属性,属性值与控件的id属性

值保持一致,实现文本与控件绑定

3. 隐藏域和文件选择框

1. 隐藏域

需要提交给服务器,但是不需要呈现给用户的内容,

都可以使用隐藏域表示

例如 : 用户id

语法 :

name定义控件名称,value设置控件的值,都是必填项

2. 文件选择框

1. 语法

2. 涉及二进制数据提交,文件,图片,mp3

需要设置form enctype属性,指定数据提交

方式为post

4. 下拉选择框

北京

上海

5. 文本域,可以支持多行输入

语法 :

标签属性 :

cols : 指定文本域默认宽度,宽度是通过列数控制的

以英文字符数量为准,中文字符减半

rows : 指定文本域行数

特点 : 文本域的大小可以由用户手动调整

6. 按钮

分类 :

1. 提交按钮 :

点击时,将表单数据发送给服务器

value 属性设置按钮的显示文本

2. 重置按钮 :

点击时,会将表单数据还原成默认状态

3. 普通按钮

绑定自定义事件

4. 按钮显示文本

1. 按钮标签,可以在HTML中任意地方使用,需要绑定

自定义事件

2. 如果按钮标签放在form标签中使用,默认具备提交

功能,等同submit