##表格标签

其实在过去表格标签用的非常非常的多，绝大数的网站都是使用表格标签来制作的，也就是说表格标签是一个时代的代表

1.什么是表格标签？

作用：用来给一堆数据添加表格语义

其实表格标签是一种数据的表现形式，当数据量足够大的时候，表格这种展现形式是被认为最清晰的一种展现形式

2.格式：

<table>

    <tr>

        <td>需要显示的内容</td>

    </tr>

</table>

其实表格标签中的table代表整个表格，也就是一堆table标签就是一个表格

其实表格标签中的tr代表整个表格中的一行数据，也就是说一对tr标签就是表格中的一行

其实表格标签中的td标签代表表格中一行中的一个单元格

3.注意点：

3.1表格标签有一个边框属性，这个属性决定了边框的宽度，默认情况下这个属性值为0，所以看不到边框

3.2表格标签和列表标签一样，table/tr/td是一个整体，都是同时出现的

4.表格标签的属性：

1.宽度和高度的属性

可以给table和td标签使用

1.1表格的宽度和高度属性默认是按照内容的尺寸来调整的，也可以通过table标签设置width/height属性的方式，手动指定高度和宽度

1.2如果给td标签添加属性，会修改当前单元格的宽度和高度，不会影响整个表格的宽度和高度

2.水平对齐和垂直对齐的属性

其中水平标签可以给table/tr/td标签使用

垂直标签只能给tr标签和td标签使用

2.1给table标签设置align属性，可以控制表格在水平方向的对齐方式

2.2给tr标签设置align属性，可以控制当前行中所有单元格内容的水平对齐方式

2.3给td标签设置align属性，可以控制当前单元格内容的水平对齐方式

2.4给tr标签设置valign属性，可以控制当前行中所有单元格内容的垂直对齐方式

2.5给td标签设置valign属性，可以控制当前单元格内容的垂直对齐方式

注意：如果td中设置了alight/valign属性，tr中也设置了alight/valign属性，那么单元格中的内容会按照td中设置的来对齐

3.外边距和内边距的属性

只能给table标签使用

3.1外边距就是单元格与单元格之间的距离，默认情况下外边距为2px

3.2内边距就是单元格的边框和文字之间的间隙,默认情况内边距为1px

5.拓展内容：

--细线表格

1.给table标签设置 bgcolor=\"black\"（背景颜色）

2.给tr标签设置bgcolor=\"white\"

3.给table标签设置cellspacing=\"0.1px\"

4.table tr td 都可以用bgcolor

--表格标题标签

1.格式:<caption>xxxxx</caption>紧跟table标签之后

2.默认相对于表格居中

--标题单元格标签

在表格标签中提供了一个标签专门用来储存每一列的标题，这个标签叫做th标签，只要将当前列的标题存储在这个标签中就会自动居中+加粗文字

由此发现，其实表格中有两种单元格，一种是td，一种是th，td是专门用来存储数据的，th是专门用来存储当前列的标题的

--合并单元格

1.水平方向上的单元格合并

可以给td标签添加一个colspan属性，来指定把某一个单元格当作多个单元格来看待

例如：

<td colspan=\"2\">xxx</td>

含义：把当前单元格当做两个单元格来看待

2.垂直方向上的单元格合并

可以给td标签添加一rowspan属性，来指定把某一个单元格当作多个单元格来看待

例如：

<td rowspan=\"2\">xxx</td>

含义：把当前单元格当做两个单元格来看待

注意点：

-由于把某个单元格当作了多个单元格来看，所以就会多出一些单元格，所以需要删除一部分单元格才能正常显示

-一定要记住单元格合并永远都是向后或者向下合并，而不能向前或者向上合并

以上所讲内容仅作了解，在企业开发中不赞成使用这样的属性来修改样式，而是用css