表格就是大家平時(shí)看到的二維表浇坐，比如Excel表之類的
表格：分為表頭睬捶、表身、表腳 三部分吗跋。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
<style type="text/css">
td{
text-align: center; /*表格居中*/
}
</style>
</head>
<body>
<table border="1" style="border-collapse:collapse;width:200px"> <!--合并表格邊框-->
/*
collapse 邊框合并侧戴，如果相鄰的話，共用一個(gè)框
separate 默認(rèn)值跌宛，邊框分開酗宋，不合并
*/
<caption>我是表頭</caption>
<thead>
<tr>
<th>姓名</th>
<th>性別</th>
<th>年齡</th>
</tr>
</thead>
<tbody>
<tr>
<td>啊海</td>
<td>男</td>
<td>18</td>
</tr>
<tr>
<td>啊蘭</td>
<td>女</td>
<td>18</td>
</tr>
<tr>
<td>小白</td>
<td>女</td>
<td>18</td>
</tr>
</tbody>
</table>
</body>
</html>
效果預(yù)覽
image.png
合并行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格</title>
<style type="text/css">
td{
text-align: center; /*表格居中*/
}
</style>
</head>
<body>
<table border="1" style="border-collapse:collapse;width:200px"> <!--合并表格邊框-->
<caption>我是表頭</caption>
<thead>
<tr>
<th>姓名</th>
<th>性別</th>
<th>年齡</th>
</tr>
</thead>
<tbody>
<tr>
<td>啊海</td>
<td>男</td>
<td rowspan="4">18</td>
</tr>
<tr>
<td>啊蘭</td>
<td>女</td>
<!-- <td>18</td> -->
</tr>
<tr>
<td>小白</td>
<td>女</td>
<!-- <td>18</td> -->
</tr>
</tbody>
</table>
<!--
rowspan 合并行
colspan 合并列
-->
</body>
</html>
效果預(yù)覽
image.png
