6.HTML表格元素
第六章 表格元素
一、
table (表示表格) thead (表示标题行)
tbody (表示表格主题) tfoot (表示表脚)
tr (表示一行单元格) th (表示标题行单元格)
td (表示单元格) col (表示一列)
colgroup (表示一组对) caption (表示表格标题)
1、<table><tr><td> 构建基础表格；
2、<th> 为表格添加标题单元格；
3、<thead> 添加表头；
4、添加完<tfoot><thead><tbody>，他们的顺序可以随意摆放，系统会自动表格排序，如果不写需要按顺序编写。
<!DOCTYPE html>
<html land="zh-cn">
<head>
<meta charset="utf-8">
<title>表格元素</title>
</head>
<body>
<table border="1" style="width:300px">
<caption>这是一个表格</caption> //表格标题；
<tbody>
<tr style="background:red;"> //这一行全部为红色背景，黑色字体；
<td>张三</td>
<td>男</td>
<td>未婚</td>
</tr>
<tr>
<td>李四</td>
<td>女</td>
<td>已婚</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">统计共：2人</td> //colspan是合并横行单元格
</tr>
</tfoot>
<thead>
<colgroup style="background:red;" span="1"></colgroup>
//一整列为红色背景，如果1改为2，则表示前两列背景为红色，如果只需要第二列为红色如下；
//第一行可以写成 <col>或<colgroup style="background:red;" span="1"></colgroup>；
//第二行写 <colgroup style="background:red;" span="1"></colgroup>；
<tr>
<th rowspan="4">基本情况</th> //第一列合并单元格，且有“基本情况”4个字；
<th>姓名</th>
<th>性别</th>
<th>婚否</th>
</tr>
</thead>
</table>
</body>
</html>
