<学习html>第五天笔记-表格table（创建表格、表格属性、表头标签、表格结构、表格标题标签、合并单元格）

（十一）表格 table

1、创建表格
语法格式：

<table>
    <tr>
        <td>单元格内的文字</td>
        .......
    </tr>
</table>

<table></table>、<tr></tr>、<td></td>是创建表格的基本标签，缺一不可。
①<table></table>用于定义一个表格；
②<tr></tr>用于定义表格中的一行，必须嵌套在<table></table>标签中；在table中包含有几对tr标签，就有几行表格；
③<td></td>用于定义表格中的单元格，必须嵌套在<tr></tr>标签中,在tr标签中包含有几对<td></td>就表示该行中有多少单元格。

*注意
①<tr></tr>中只能嵌套<td></td>
②<td></td>中可以放所有元素

对于表格的宽度、高度和边框粗细的设置都放在<table.....></table>
例如：设置“表格的宽度为500像素，高度为300像素，边框为1像素”则代码如下：
<table width="500" height="300" border="1"></table>

2、表格属性
以下所有属性均是添加在<table........></table>

表格属性图

表格属性实例代码图

表格属性实例效果图

3、表头标签
表头一般位于表格的第一行或第一列，其文本加粗居中显示。
设置方法：用表头标签<th></th>替代相应单元格标签<td></td>即可。

4、表格结构
在使用表格进行布局时，可以将表格划分为头部、主体和页脚（页脚暂时不管）
①<thead></thead>用于定义表格的头部。必须位于<table></table>标签中，一般包含网页的logo、导航等头部信息。
②<tbody></tboby>用于定义表格的主体部分。位于<table></table>标签中，一般包含网页中除头部和底部之外的其他内容。

5、表格标题标签

<caption></caption>

语法格式：

<table>
    <caption>我是表格标题</caption>
</table>

注意：<caption></caption>必须放在<table></table>中。即：<table><caption></caption></table>

6、合并单元格

①跨行合并：rowspan ②跨列合并：colspan
合并单元格的思想：将多个内容合并的时候，就会有多余的东西，将多余的东西删除。例如：把3个td合并成一个，那就多余了两个，需要删除。

公式：删除的个数=合并的个数-1

语法格式：<td rowspan="将要合并的单元格个数">单元格的文本内容</td>

合并的原则：合并时先保留上面的和左边的。

合并单元格实例代码图

合并单元格实例效果图