（二）html 复杂表格
在这里插入图片描述
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>程序员之美</title>
<meta charset="utf-8" />
<style type="text/css">
/*表格样式*/
table {
width: 90%;
background: #ccc;
margin: 10px auto;
border-collapse: collapse; /*border-collapse:collapse合并内外边距(去除表格单元格默认的2个像素内外边距*/
}
th, td {
height: 25px;
line-height: 25px;
text-align: center;
border: 1px solid #ccc;
}
th {
background: #eee;
font-weight: normal;
}
tr {
background: #fff;
}
tr:hover {
background: #D1FFFC;
}
td a {
color: #06f;
text-decoration: none;
}
td a:hover {
color: #06f;
text-decoration: underline;
}
</style>
</head>
<body>
<table border="1" width="100%" height="100" cellspacing="0" cellpadding="5">
<tr>
<th rowspan="2">最近修改日期</th>
<th colspan="20">国家励志奖学金候选人名单</th>
</tr>
<tr>
<th>姓名</th>
<th>分院</th>
<th>学号</th>
<th>曾获奖项</th>
<th>职位描述</th>
<th>操作</th>
</tr>
<tr>
<td>2020-10-30</td>
<td>张旭</td>
<td>信息技术学院</td>
<td>1902320136</td>
<td>博客专家，蓝桥杯二等奖，博客大赛二等奖</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
<tr>
<td>2020-10-30</td>
<td>李四</td>
<td>信息技术学院</td>
<td>3212320136</td>
<td>英语比赛一等奖，CAD编程二等奖，博客大赛二等奖</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
<tr>
<td>2020-10-30</td>
<td>张飞</td>
<td>医学技术学院</td>
<td>3212320136</td>
<td>博客专家，英语四级</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
<tr>
<td>2020-10-30</td>
<td>于飞</td>
<td>建筑与工程技术学院</td>
<td>3212320136</td>
<td>英语比赛三等奖，普通话二级，云+社区作者</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
<tr>
<td>2020-10-30</td>
<td>张静</td>
<td>药学技术学院</td>
<td>3212320136</td>
<td>博客大赛一等奖，计算机二级</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
<tr>
<td>2020-10-30</td>
<td>于静</td>
<td>信息技术学院</td>
<td>3212320136</td>
<td>英语四级，计算机四级</td>
<td><a href="www.baidu.com">点击查看</a></td>
<td><a href="www.baidu.com">编辑</a> <a href="www.baidu.com">删除</a></td>
</tr>
</table>
</body>
</html>本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2020-10-30 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读