html5居下,HTML5的基础标签(下)

1.表格标签：

格式：

border:默认情况下表格的边框宽度为0看不到, 通过border属性给表格指定边框宽度

width: 默认情况下表格的宽度是由内容自动计算出来的, 可以通过width属性指定表格的宽度

height:默认情况下表格的高度是由内容自动计算出来的, 可以通过height属性指定表格的高度

cellspacing: 外边距. 默认情况下单元格之间有2个像素的间隙, 可以通过cellpadding指定表格之间的间隙

cellpadding:内边距. 默认情况下单元格边缘距离内容有1个像素的内边距, 可以通过cellpadding属性指定单元格边缘和内容之间的内边距

align: 规定表格相对周围元素的对齐方式, 它的取值有center、left、right

给table设置align属性, 是让表格在浏览器中居左/居右/居中

给tr设置align属性, 是让当前行中所有内容居左/居右/居中

给td设置align属性,是让当前单元格中所有内容居左/居右/居中

该属性仅仅作为了解, 企业开发中用css代替, 因为HTML仅仅用于说明语义

如果td中设置了align属性, tr中也设置了align属性, 那么单元格中的内容会按照td中设置的来对齐

valign: 规定表格相对周围元素的对齐方式, 它的取值有center、left、right

给table设置valign属性, 无效

给tr设置valign属性, 是让当前行中所有内容居上/居中/居下

给td设置valign属性,是让当前单元格中所有内容居上/居中/居下

如果td中设置了valign属性, tr中也设置了valign属性, 那么单元格中的内容会按照td中设置的来对齐

bgcolor:规定表格的背景颜色

给table设置bgcolor属性, 是给整个表格设置背景颜色

给tr设置bgcolor属性, 是给当前行设置背景颜色

给td设置bgcolor属性, 是给当前单元格设置背景颜色

2.表单中有两种类型的单元格, 一种是标准单元格td, 一种是表头单元格th

th标签:给每一列设置标题, 单元格中的内容会自动加粗，居中

caption标签:给整个表格设置标题

一定要嵌套在talbe标签内部才有效

格式：

title

3.合并单元格

合并当前列的哪几个单元格, 注意colspan之后向后合并, 不会向前合并

3.1横向合并calspan

格式：

3.2纵向合并rowspan

格式：

4.表单

作用: 用于收集用户信息, 让用户填写、选择相关信息

所有的表单内容，都要写在form标签里面

form标签中有两个比较重要的属性action和method

明文输入框

作用: 用户可以在输入框内输入内容

title：

暗文输入框

作用: 用户可以在输入框内输入内容

title:

给输入框设置默认值

title:

规定输入字段中的字符的最大长度

title:

单选框(radio)

作用: 用户只能从众多选项中选择其中一个

单选按钮，天生是不互斥的，如果想互斥，必须要有相同的name属性

checked是用来设置默认属性

男

女

多选框(checkbox)

作用: 用户只能从众多选项中选择多个

复选框，最好也是有相同的name(虽然他不需要互斥，但是也要有相同的name)

篮球

足球

abel标签

作用: label标签不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性

注意事项:

表单元素要有一个id，然后label标签就有一个for属性，for属性和id相同就表示绑定了

所有表单元素都可以通过label绑定

格式：

账号：

按钮

作用: 定义可点击按钮(多数情况下，用于通过 JavaScript 启动脚本)

图片按钮

作用:定义图像形式的提交按钮

重置按钮

作用: 定义重置按钮。重置按钮会清除表单中的所有数据

这个按钮不需要写value自动就有“重置”文字

reset只对form表单中表单项有效果

提交按钮

作用:定义提交按钮。提交按钮会把表单数据发送到action属性指定的页面

格式：

注意事项:

这个按钮不需要写value自动就有“提交”文字

要想通过submit提交数据到服务器, 被提交的表单项都必须设置name属性

默认明文传输(GET)不安全, 可以将method属性设置为POST改为非明文传输(学到Ajax再理解)

隐藏域

作用: 定义隐藏的输入字段

格式：

取色器

格式：

HTML5中input类型增加了很多type类型, 例如color、date但是都不兼容, 后面讲到浏览器兼容时会重点讲解

日期选择器

HTML5中input类型增加了很多type类型, 例如color、date但是都不兼容, 后面讲到浏览器兼容时会重点讲解

数据列表

作用: 给输入框绑定待选项

格式：

待选项内容

多行文本框(文本域)

作用: textarea标签用于在表单中定义多行的文本输入控件

cols属性表示columns“列”, 规定文本区内的可见宽度

rows属性表示rows“行”, 规定文本区内的可见行数

格式：默认