菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 前端—张佳豪—2023414 [打印本页]

作者: 张佳豪 时间: 2023-4-12 19:35
标题: 前端—张佳豪—2023414

表格标签
表格的作用
可以更加清晰的展示数据，增强可读性。
表格标签的基础
<table></table>定义表格标签
<tr></tr> 标签用于定义表格中的行（table row），要嵌套在<table></table>标签中
<td></td>标签用于定义行中的单元格（table data）, 必须嵌套在<tr></tr>标签中
<th></th>标签定义行中的内容是否是表头内容，表头的内容会加粗并且居中对齐
表格标签中的常用属性
align 规定表格的相对于周围元素的水平对齐方式
属性值：left、center、right
border 固定表格的是否拥有边框，默认是没有的
属性值：1 代表有边框
width 固规定表格的宽度
属性值：像素值
height 规定表格的高度
属性值：像素值
cellpadding 控制单元格内容和单元格边框之间的距离（一般会设置为0）
属性值：像素值，默认是1像素
cellspacing：控制单元格和单元格之间的距离（一般会设置为0）
属性值：像素值，默认是2像素
一般控制样式会使用CSS，目前可以先通过属性来控制。
表格的结构标签
表格标签中，用<thead></thead>来确定表头区域、用<tbody></tbody>来确定表格的主体区域，这样能让表格的结构更加清晰，也方便后期使用JS来获取表格中的内容
合并单元格
合并单元格的步骤
1、找到目标单元格
2、确定是跨行还是跨列合并、跨行合并 rowspan=“被合并单元格的个数”, 合并单元格的个数最少是2、跨列合并 colspan=“被合并单元格的个数”，合并单元格的个数最少是2
3、将被和合并的单元格删除掉

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)