HTML第三天（P08表格标签学完）

表格标签：

用于显示、展示数据。

##  tr代表行，td代表单元格
<table>
        <tr>
            <td>姓名</td>
            <td>性别</td>
            <td>年龄</td>
        </tr>
        <tr>
            <td>马化腾</td>
            <td>男</td>
            <td>45</td>
        </tr>
        <tr>
            <td>马云</td>
            <td>男</td>
            <td>60</td>
        </tr>
    </table>

---

 表头单元格：

一般表头单元格位于表格的第一行或第一列，表头单元格里的文本内容加粗居中显示。<th>表示表头table head。

<table>
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
        </tr>
        <tr>
            <td>马化腾</td>
            <td>男</td>
            <td>45</td>
        </tr>
        <tr>
            <td>马云</td>
            <td>男</td>
            <td>60</td>
        </tr>
    </table>

---

表格属性

 <table align="center" border="1" cellspacing="0" cellpadding="10">
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
        </tr>
        <tr>
            <td>马化腾</td>
            <td>男</td>
            <td>45</td>
        </tr>
    </table>

 align表示表格的位置在左右还是中间，值为left，right，center。

border表示有无边框，cellspacing表示单元格之间的空白（值为0的时候格子如上图所示），

cellpadding表示单元边沿与其内容之间的空白，默认1像素。

此外还可以设置width和height。

---

可以在<table></table>内部使用<thead></thead>和<tbody></tbody>来将表头和表格分开，这样对表的结构会更直观，注意在<thead></thead>内部还是要使用<tr><th>   </th></tr>。

---

合并单元格：

跨行：最上侧单元格为目标单元格，写合并代码。<td rowspan="2"></td>

跨列：最左边单元格为目标单元格，写合并代码。<td colspan="2"></td>

写完以后记得将多余的单元格删掉。