html中的表格

<table border="1">
  <tr>
    <th>姓名</th>
    <th>性别</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>男</td>73978dc6-3fd6-4df1-9be3-296c2303ca5b
    <td>20</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>男</td>
    <td>21</td>
  </tr>
  <tr>
    <td>王二</td>
    <td>女</td>
    <td>21</td>
  </tr>
  <tr>
	<td>总结</td>
	<td>aaaaaaaa</td>
	<td></td>
  </tr>
</table>

效果

姓名	性别	年龄
张三	男	20
李四	男	21
王二	女	21
总结	aaaaaaa

语法

border="1" 你只要记住有这个标u签可以显示表格边框, 没有这个标签就不能显示表格边框, 这个标签是css的一个标签
table 中

• th: 标题(加粗)
• tr: 横向内容
• td: 内容
• thead: 表格头部
• tbody: 表格主体
• ftoot: 表格底部
  记住tr不可以与td 交换
  但是td可以与th相互交换
  tr里面只能包含td或th
thead,tbody,tfoot 在网页中没有效果, 只是划分一下结构, 可有可无

<table>
	<thrad>
		<th>...</th>
	</thead>
	<tbody> 
		<th>...</th>
	</tbody>
</table>

合并单元格

<table border="1">
	<tr>
		<th>姓名</th>
		<th>性别</th>
		<th>年龄</th>
	</tr>
	<tr>
		<td>张三</td>
		<td rowspan="2">男</td>
		<td>20</td>
	</tr>
		<tr>
		<td>李四</td>
		<!--<td>男</td>-->
		<td>21</td>
	</tr>
	<tr>
		<td>王二</td>
		<td>女</td>
		<td>21</td>
	</tr>
	<tr>
		<td>总结</td>
		<td colspan="2">aaaaaaa</td>
		<!--<td></td>-->
	</tr>
</table>

效果

姓名	性别	年龄
张三	男	20
李四		21
王二	女	21
总结	aaaaaaa

注意

• 要明确合并目标
• 左右合并只要保留左边单元格
• 上下合并只要保留上面单元格
• 删除其他被合并到的单元格
• 不能跨结构合并单元格

语法

上下合并单元格
td后面添加rowspam="2"
2怎么了来的, 你向下合并几格就输入几

左右合并单元格
td后面添加colspan="2"
2怎么了来的, 你向右合并几格就输入几