标签之表格

表格展示效果

表格在数据展示方面非常简单，并且表现优秀

表格组成与特点

行、列、单元格

单元格特点：同行等高、同列等宽。

---

表格标签

表格：<table>

行：<tr>

单元格(列)：<td>

xxxxxxxxxx
<table border="1">
    <tr>
        <td>尚学堂</td>
        <td>百战程序员</td>
    </tr>
    <tr>
        <td>阿里</td>
        <td>京东</td>
    </tr>
</table>

快捷键

快速生成表格结构：table>tr*2>td{单元格}

---

表格其他标签

表格名字：<caption>

表格头部：<thead>

特殊单元格：<th>

表格的身体：<tbody>

表格的脚步：<tfoot>

复杂且并不常用的表格标签

xxxxxxxxxx
<table>
    <caption>表格名字</caption>
    <thead>
        <th>姓名</th>
        <th>年龄</th>
    </thead>
    <tbody>
        <tr>
            <td>张三</td>
            <td>30</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td>李四</td>
            <td>20</td>
        </tr>
    </tfoot>
</table>

实时效果反馈

1. 以下那个是表格组成标签组合：

A table + tr + td

B table + tr + dl

C ul + tr + td

D ul + table + tr

2. 以下代码，空格处要填写的标签：

xxxxxxxxxx
<table>
    ___
        <td>尚学堂</td>
        <td>百战程序员</td>
    ___
</table>

A <th> </th>

B <tbody> </tbody>

C <td> </td>

D <tr> </tr>

答案

1=>A 2=>D