<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--
需求1：显示一个三行四列的标签
<table>:定义一个表格
<tr>：行
<td>：列
<th>：表头(加粗效果)
<thead>:把表头包裹
<tbody>:把表头包裹
<tfoot>:脚的部分
<border>:决定表格的边框
cellspacing:是单元格之间的间距
需求2：给当前表格添加一个标题
<caption>:表格的标题，自动居中
需求3：合并张三和李四的性别 合并行
<rowspan>:取值：合并N行，就取N，同时依次删除N-1个单元格
需求3：合并张三的姓名和年龄 合并列
<colspan>:取值：合并N行，就取N，同时删除tr下N-1个单元格
-->
<table border="1" cellspacing="0" " width="400px";">
<caption>学生信息表</caption>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
<th>电话</th>
</tr>
<tr>
<td colspan="2">张三 18</td>
<td rowspan="2">男</td>
<td>133</td>
</tr>
<tr>
<td>李四</td>
<td>22</td>
<td>155</td>
</tr>
</table>
<br />
<br />
<br />
<br />
<h1>两行两列合并成一个单元格</h1>
<table width="400px" border="1" cellspacing="0">
<tr>
<td>5</td>
<td>5</td>
<td>5</td>
</tr>
<tr>
<td colspan="2" rowspan="2">1</td>
<!--<td>2</td>-->
<td>3</td>
</tr>
<tr>
<!--<td colspan="2">4</td>-->
<!--<td>5</td>-->
<td>6</td>
</tr>
</table>
</body>
</html>
浙公网安备 33010602011771号