3.表格标签

作用:给一堆数据添加表格语义,使数据结构化,更清晰,易于阅读

结构(掌握):
<table>
    <tr>
        <td></td>
          .....
        <td></td>
    </tr>
</table>

tr:table row
td:table data

表格标签属性(仅了解,因为CSS)

align属性:水平对齐(左中右)。用于table、tr、td标签

valign属性:竖直对齐(上中下)。用于tr、td标签

width、height属性。可用于table、td标签

cellspacing属性:外边距(单元格之间的间距),只能用于table标签

cellpadding属性:内边距(td内容与单元格边框之间的距离)

细线表格制作(仅理解)

1.table标签:设置bgcolor属性
2.tr标签设置bgcolor属性
3.table标签设置cellspacing属性

表格中的其他标签(仅理解)

th标签:每一列的字段名,标签中的内容会自动居中、加粗。th:table header

caption标签:表格标题,<caption>标题</caption>

表格的完整结构(仅了解)

标题(caption标签)、表头(thead标签)、主体(tbody标签)、页尾(tfoot标签)

<table>

    <caption>标题</caption>

    <thead>
        <tr>
            <th>每一列的标题</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>数据</td>
        </tr>
    </tbody>

    <tfoot>
        <tr>
            <td>数据</td>
        </tr>
    </tfoot>

</table>

单元格合并(仅理解)

水平方向合并:给td标签增加colspan属性,把单个单元格当作多个单元格看待

垂直方向合并:给td标签增加rowspan属性