<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>简历</title>
</head>
<body>
<!--
1.制作复杂表格的方法：
a.确定表格的最大行数
b.确定每一行有多少个单元格，用td表示出来
c.确定没一个单元格是否有合并现象，行合并设置rowspan值，列合并设置colspan
-->
<table border="1" cellspacing="0" cellpadding="0" width="550" height="600">
<tr>
<td width=12%>
学校
</td>
<td colspan="5" id="school" width=65%>
<a href="http://www.swust.edu.cn/">西南科技大学</a>
</td>
<td rowspan="5">
<img src="img/1540811489523.jpeg" width="130px" height="175px" alt=“加载失败”>
</td>
</tr>
<tr>
<td>
专业
</td>
<td colspan="5" id="profession">
<a href="https://baike.so.com/doc/5392576-5629410.html">软件工程</a>
</td>
</tr>
<tr>
<td>
姓名
</td>
<td width="15%" class="input">
小傻子
</td>
<td width="15%">
性别
</td>
<td class="input">
女
</td>
<td>
民族
</td>
<td class="input">
汉
</td>
</tr>
<tr>
<td>
出生年月
</td>
<td class="input">
1997.7.7
</td>
<td>
籍贯
</td>
<td class="input">
四川成都
</td>
<td>
身高
</td>
<td class="input">
161
</td>
</tr>
<tr>
<td>
学历
</td>
<td class="input">
本科
</td>
<td>
政治面貌
</td>
<td colspan="3" class="input">
预备党员
</td>
</tr>
<tr>
<td>
就业意向
</td>
<td colspan="6" class="input">
在家貌美如花
</td>
</tr>
<tr>
<td>
兴趣爱好
</td>
<td colspan="6" class="input">
玩王者荣耀
</td>
</tr>
<tr>
<td>
个人说明
</td>
<td colspan="6" class="input">
所爱隔山海，山海不可平
</td>
</tr>
<tr>
<td>
家庭住址
</td>
<td colspan="6" class="input">
四川成都
</td>
</tr>
<tr>
<td>
住宿住址
</td>
<td colspan="2" class="input">
成都的某个街头
</td>
<td width="13%">
联系电话
</td>
<td width="15%" class="input">
18288888888
</td>
<td>
手机
</td>
<td class="input">
18888888888
</td>
</tr>
<tr>
<td>
任职情况
</td>
<td colspan="6" class="input">
班长，团支书，学生会部长
</td>
</tr>
<tr>
<td rowspan="9" >本人简历</td>
<td colspan="2">时间</td>
<td colspan="2">学校</td>
<td colspan="2">任职</td>
</tr>
<tr class="input">
<td colspan="2">2015-2019年</td>
<td colspan="2">西南科技大学</td>
<td colspan="2">班长</td>
</tr>
<tr class="input">
<td colspan="2">2015-2019年</td>
<td colspan="2">西南科技大学</td>
<td colspan="2">团支书</td>
</tr>
<tr class="input">
<td colspan="2">2016-2017年</td>
<td colspan="2">西南科技大学</td>
<td colspan="2">学生会部长</td>
</tr>
<tr>
<td colspan="6"></td>
</tr>
<tr>
<td colspan="6"></td>
</tr>
<tr>
<td colspan="6"></td>
</tr>
<tr>
<td colspan="6"></td>
</tr>
<tr>
<td colspan="6"></td>
</tr>
<tr>
<td></td>
<td colspan="6"></td>
</tr>
</table>
</body>
<style type="text/css">
body tr{
height:30px;
}
body tr td{
font-size: 11px;
text-align: center;
}
#school a{
text-decoration: none;
color: grey;
}
#school a:hover{
color: red;
}
#profession a{
text-decoration: none;
color: grey;
}
#profession a:hover{
color: red;
}
.input{
color: grey;
}
</style>
</html>
学校和专业名有超链接,简单的鼠标移动事件
效果图：
image.png
