712 字
3 分钟阅读
html – 表格
简介
html表格

代码演示
<html>
<head>
<title>html 表格</title>
</head>
<style>
table {
/* border-collapse: 控制表格边框是否合并 */
/* separate: 表格边框不合并 */
/* collapse: 表格边框合并 */
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 5px;
text-align: center;
}
thead {
background-color: gray;
}
</style>
<body>
<!-- table 标签:表格标签 -->
<!-- thead 标签:定义表头 可选 -->
<!-- tbody 标签:定义表格内容 可选 -->
<!-- tr 标签:定义表格行 可以包裹多个td -->
<!-- td 标签:定义表格单元格 -->
<table>
<thead>
<tr>
<td>编号</td>
<td>姓名</td>
<td>性别</td>
<td>年龄</td>
<td>操作</td>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>张三</td>
<td>男</td>
<td>18</td>
<td>
<a href="#">修改</a>
<a href="#">删除</a>
</td>
</tr>
<tr>
<td>2</td>
<td>张三</td>
<td>男</td>
<td>18</td>
<td>
<a href="#">修改</a>
<a href="#">删除</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
效果

CSS 样式
border-collapse:控制表格边框是否合并

[…] 表格 跳转 […]