表格元素布局
程序员文章站
2022-04-19 18:45:12
...
1. 基本的表格设置
table 元素： 在网页中创建一个表格内容
tr元素： 在网页中创建表格的一行
td元素： 在网页中创建表格的一列
th元素： 创建表格中的表头，特殊的td元素
caption： 表格的名字
2. 基本表格
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
table,
tr,
th,
td,
caption {
border: 1px solid blue;
border-collapse: collapse;
}
</style>
</head>
<body>
<table>
<caption>学员信息表</caption>
<tr>
<th>name</th>
<th>age</th>
<th>home</th>
</tr>
<tr>
<td>gkl</td>
<td>18</td>
<td>wuhan</td>
</tr>
</table>
</body>
</html>
3. 合并列
<tr>
<th>name</th>
<th colspan="2">age</th>
</tr>
4. 合并行
<tr>
<td>gkl</td>
<td rowspan="2">18</td>
<td>wuhan</td>
</tr>
<tr>
<td>gkl</td>
<!-- <td>18</td> -->
<td>wuhan</td>
</tr>
上一篇： 了解css（div+网页布局）
下一篇： 动画样式