HTML表格标签的认识
表格基本标签、表格的相关属性、表格标题和表头单元格标签
李雨鸣
表格基本标签
场景：在网页中以行+列的单元格的方式整齐展示和数据，如：学生成绩表
| 标签名 | 说明 |
| table | 表格整体，可用于包裹多个tr |
| tr | 表格每行，可用于包裹td |
| td | 表格单元格，可用于包裹内容 |
注意点：标签的嵌套关系：table>tr>td
表格的相关属性
场景：设置表格基本展示效果
常见相关属性：
| 属性名 | 属性值 | 效果 |
| border | 数字 | 边框宽度 |
| width | 数字 | 表格宽度 |
| height | 数字 | 表格高度 |
注意点：实际开发时针对样式效果推荐使用css设置
<table border="1" width="500" height="150"> <tr> <td>姓名</td> <td>成绩</td> <td>评语</td> </tr> <tr> <td>夏洛</td> <td>100分</td> <td>厉害了</td> </tr> <tr> <td>马冬</td> <td>5分</td> <td>傻逼</td> </tr> <tr> <td>张扬</td> <td>0分</td> <td>有才</td> </tr> </table>
表格标题和表头单元格标签
场景：在表格中表示整体大标题和一列小标题
其他标签：
| 标签名 | 名称 | 说明 |
| caption | 表格大标题 | 表示表格整体大标题，默认在表格整体顶部居中位置显示 |
| th | 表头单元格 | 表示一列小标题，通常用于表格第一行，默认内部文字加粗并居中显示 |
注意点：
caption标签书写在table标签内部
th标签书写在tr标签内部（用于替换td标签）
<table border="1" width="500" height="150"> <caption><strong>学生成绩单</strong></caption> <tr> <th>姓名</th> <th>成绩</th> <th>评语</th> </tr> <tr> <td>夏洛</td> <td>100分</td> <td>厉害了</td> </tr> <tr> <td>马冬</td> <td>5分</td> <td>傻逼</td> </tr> <tr> <td>张扬</td> <td>0分</td> <td>有才</td> </tr> </table>
