标签:跨行 meta add cin htm 个数 foo nbsp 单元格
5.table和div
5.1 表格
软件1810班名册
学号 |
姓名 |
性别 |
年龄 |
01 |
张三 |
男 |
21 |
02 |
李四 |
女 |
20 |
…… |
|
|
|
人数合计 |
32 |
表格的组成部分:标题、表头、主体、表尾
<table>定义一个表格
<caption>定义表格的标题
<thead>定义表头部分
<tbody>定义表格主体(数据)部分
<tfoot>定义表尾,一般显示汇总信息等。
<tr>定义一行
<th><td>定义一个数据项(单元格),<th>一般用于表头,有加粗样式,<td>一般用于表格主体部分,没有加粗样式
<td>的rowspan和colspan分别定义单元格跨行的行数、跨列的列数.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5">
<caption>软件1810班名册</caption>
<thead>
<tr>
<th>学号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>01</td>
<td>张三</td>
<td>男</td>
<td>22</td>
</tr>
<tr>
<td>02</td>
<td>李四</td>
<td>女</td>
<td>21</td>
</tr>
<tr>
<td>03</td>
<td>王五</td>
<td>男</td>
<td>20</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">合计人数</td>
<td>32</td>
</tr>
</tfoot>
</table>
</body>
</html>
5.2 div
<div>标签定义一个分块(division)
<div style="width: 300px;height: 200px; background-color: gray"></div>
显示特点:在新的一行进行显示。块级标签。
块级元素和内联元素的区别:
块级元素占满行,而内联元素会按照顺序从左至右依次排列
标签:跨行 meta add cin htm 个数 foo nbsp 单元格
原文地址:https://www.cnblogs.com/ly903/p/14645132.html