HTML 中的 table 表格标签

主要作用

• 表格主要是用于显示，展示数据的，因为它可以让数据显示的非常规整，可读性好。

---

基本用法

<table>
	<tr>
		<td></td>
	</tr>
</table>

• <tr> 标签是用于定义表格中的行，必须嵌套在 <table></table> 标签中
• <td> 标签是用于定义表格中的单元格，必须嵌套在 <tr> 中

---

表头单元格

• 表头中的内容会加粗并且居中显示

<table>
	<tr>
		<th>表头</th>
	</tr>
</table>

---

表格属性

属性名	属性值	描述
align	left，right，center	规定表格相对周围元素的对齐方式
border	1 或者 “”	规定表格单元格是否拥有边框，默认为 “”，表示没有边框
cellpadding	像素值	规定单元格边缘与其内容之间的空白，默认为 1 像素
cellspacing	像素值	规定单元格之间的空白，默认是 2 像素
width	像素或者百分比	规定表格的宽度

---

表格结构标签

• thead 和 tbody 两个标签将表格分为两个大的部分，显得布局更加清晰

<table>
	<thead>
		<tr>
			<th>表头</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>123</td>
		</tr>
	</tbody>
</table>

---

合并单元格

• 跨行合并：rowspan = "合并单元格的个数"
• 跨列合并：colspan = "合并单元格的个数"