首先看实验内容，要做一个课程表，并且单击某一门课程名称，可以跳转到该课程的简介，而且是在同一个页面上。所以肯定要用到两个表格，一个是关于课程表的表格，一个是关于课程介绍的表格。
第一，关于课程表，把表格的宽设置成1430，高设成720，这是我经过好多次修改后，感觉让课程表看起来最合适最美观的数据了。然后将表格设置成居中，然后把表格里面那些单元格的线条清理掉，不显示线条，因为显示出来我感觉不好看。接下来再设置背景，还有背景的大小。接下来就是设置单元格的内容，包括星期几和第几节等等，然后我是按照从上到下，从左到又设置的单元格内容.因为大学的课程，是一次性占两节课的，甚至更多，所以需要合并单元格.例如Python程序设计和概率论分别占了一二节和三四节，所以在编写的时候需要将第二列的二三两行、四五两行进行合并。所以用到了rowspan，它的作用就是跨行合并，以上两个课程占了两节课，所以rowspan设置为2，在另一个图中前端这门课程是从第一节到第六节，需要向下跨6个单元格，所以rowspan=6.在设置单元格内容的时候，关于内容的颜色、字体、大小等等，都是相同的.
第二、关于点击后课程介绍的表格,其实该表格的设置和上面课程表的设置是一样的，只是替换了内容。总体上来说是先建成一个表格的总体框架，然后再向里面填充具体内容。关于课程表具体内容格式方面，我参考的是超级课程表的形式，在相关课程下面附上上课的地点，然后点击课程后出现课程的上课周数、节数、地点和授课的老师。因为实验内容里面要求点击后要出现关于这门课程的简介，所以我在最初的格式上又添加了课程简介这一内容。关于课程介绍这一个表格，和课程表表格非常相似，在课程介绍这里，我将课程名字分别设置成了同色调的不同颜色，因为我感觉非常美观。然后关于课程简介的内容，我是从百度百科、教学计划和智慧树上进行获取的。以上就是关于课程介绍这个表格的代码及设置想法。
第三、关于如何实现点击后可以到跳转到本页面的的该课程的课程简介的功能，我用的是课本上所说的锚点的方法，即<a></a>，将其嵌入到<td></td>中去。
整体代码如下：
<html>
<head>
<title>我的课表</title>
<!--
<style type="text/css">
td{
border-radius: 4%;
}
</style>
-->
</head>
<body>
<table border="0" width="1430" align="center" height="720" background="C:\Users\beixi\Desktop\20211120223434.jpg" background-size:100% 100%>
<tr align="middle">
<td width="30" ></td>
<td width="50" align="center" height="30">周一</td>
<td width="50"align="center" height="30">周二</td>
<td width="50" align="center" height="30">周三</td>
<td width="50" align="center" height="30">周四</td>
<td width="50" align="center" height="30">周五</td>
<td width="50" align="center" height="30">周六</td>
<td width="50" align="center" height="30">周日</td>
</tr>
<tr align="middle">
<td >1 </td>
<td></td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#python程序设计"> python程序设计<br/>
<font>@2号公教楼JT104</font><br/>
</a>
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#前端设计与开发">前端设计与开发<br/>
<font>@2号公教楼JT205</font><br / >
</a>
</td>
<td></td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#数据结构上机实验">数据结构上机实验<br/>
<font>@机电楼</font><br / >
</a>
</td>
<td></td>
<td rowspan="6">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#前端设计与开发上机">前端设计与开发上机<br/>
<font>@机电楼</font><br / >
</a>
</td>
</tr>
<tr align="middle">
<td >2</td>
</tr>
<tr align="middle">
<td >3</td>
<td rowspan="2" >
<a style="color=black;text-decoration: none;text-decoration: none;" href="#概率论">概率论<br/>
<font>@一号公教楼JT205</font><br / >
</a>
</td>
<td></td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#概率论">概率论<br/>
<font>@一号公教楼JT204</font><br / >
</a>
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#马克思主义基本原理概论">马克思主义基本原理概论<br/>
<font>@一号公教楼503</font><br / >
</a>
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#数据结构">数据结构<br/>
<font>@一号公教楼JT201</font><br / >
</td>
</tr>
<tr align="middle">
<td >4</td>
</tr>
<tr align="middle">
<td >5</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#数据结构">数据结构<br/>
<font>@一号公教楼JT301</font><br / >
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#大数据技术基础">大数据技术基础<br/>
<font>@一号公教楼JT202</font><br / >
</a>
</td>
</tr>
<tr align="middle">
<td >6</td>
</tr>
<tr align="middle">
<td >7</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#大学体育">大学体育<br/>
<font>@操场</font><br / >
</a>
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#大数据技术基础上机">大数据技术基础上机<br/>
<font>@机电楼</font><br / >
</a>
</td>
<td></td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#python上机实验"> python上机实验<br/>
<font>@机电楼</font><br/>
</a>
</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#大学英语">大学英语<br/>
<font>@一号公教楼206</font><br/>
</a>
</td>
</tr>
<tr align="middle">
<td >8</td>
</tr>
<tr align="middle">
<td >9</td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#保险与生活">保险与生活<br/>
<font>@一号公教楼601</font><br / >
</a>
</td>
<td></td>
<td></td>
<td rowspan="2">
<a style="color=black;text-decoration: none;text-decoration: none;" href="#多媒体课件设计与制作">多媒体课件设计与制作<br/>
<font>@一号公教楼JT402</font><br/>
</a>
</td>
</tr>
<tr align="middle">
<td>10</td>
</tr>
</table>
</font>
<h1 align="center">
<font color=black face="隶书" size=6>课程介绍 </font>
</h1>
<center> <table border="1" cellpadding="50" background="C:\Users\beixi\Desktop\20211120223434.jpg" background-size:100% 100%>
<tr>
<th width="200" height="30" >课程名称</th>
<th width="800" height="30" >课程详情</th></center>
</tr>
<tr>
<td>
<font color="#6495ED" face="隶书" size=5>
<a name="Python程序设计">Python程序设计</a>
</td>
<td> 教室：2号公教楼JT104</br>
周数：1-11周</br>
节数：周二、周四1-2节（8:30-10:05）</br>
老师：***副教授</br>
简介：《Python程序设计》作为一门程序设计语言课程，是计算机类，信息安全类等相关专业的专业基础课，体现了基本的编程技能
</td>
</tr>
<tr>
<td>
<font color="#6495ED" face="隶书" size=5>
<a name="Python上机实验">Python上机实验</a>
</td>
<td> 教室：机电楼</br>
周数：8-12周</br>
节数：周四7-8节（15:25-16:50）</br>
老师：***副教授</br>
简介：Python上机实验是在Python程序设计这门课的基础上来进行的上机实验课，目的是为了让学生在亲自动手编写代码的过程中，能够熟练的将学习到的知识运用起来
</td>
</tr>
<tr>
<td>
<font color="#5F9EA0" face="隶书"size=5>
<a name="前端设计与开发">前端设计与开发</a>
</td>
<td> 教室：2号公教楼JT205</br>
周数：1-12周</br>
节数：周三1-2节（8:30-10:05）</br>
老师：**讲师</br>
简介：《Web前端开发》是计算机网络技术、软件技术、计算机应用等专业的专业的基础课，是从《静态网页制作》课程发展而来，教学内容重点介绍HTML、CSs、DIV. JavaScript. 网站调试与发布等知识，使学生精通行业常用的网站开发技术，熟悉商业网站制作流程，达到Web前端开发工程师岗位的技术与能力要求
</td>
</tr>
<tr>
<td>
<font color="#5F9EA0" face="隶书" size=5>
<a name="前端设计与开发上机">前端设计与开发上机</a>
</td>
<td> 教室：机电楼</br>
周数：12-16周</br>
节数：周日 1-6节（8:30-15:05）</br>
老师：**讲师</br>
简介：前端设计与开发上机实验是在《前端设计与开发》这门课程的前提下进行的上机实验
</td>
</tr>
<tr>
<td>
<font color="#4682B4" face="隶书" size=5>
<a name="数据结构">数据结构</a>
</td>
<td> 教室：1号公教楼JT201</br>
周数：1-12周</br>
节数：周一5-6节 （10:25-12:00）周五3-4节（10:25-12:00）</br>
老师：***副教授</br>
简介：《数据结构》在计算机科学中是一门综合性的专业基础课。本课程程介绍如何组织数据在计算机中的存储、传递和转换。内容包括:数组、链接表、栈和队列、树与森林、图、查找、排序等。课程采用Turbo C语言作为算法的描述工具，强化数据结构基本知识和程序设计基本能力的双基训练,为后续计算机专业课程的学习打下坚实的基础
</td>
</tr>
<tr>
<td>
<font color="#4682B4" face="隶书" size=5>
<a name="数据结构上机实验">数据结构上机实验</a>
</td>
<td> 教室：实验楼北楼六机房</br>
周数：4-13周</br>
节数：周五1-2节（8:30-10:05）</br>
老师：***副教授</br>
简介：数据结构上机实验是在《数据结构》这门课程的前提下进行的上机实验
</td>
</tr>
<tr>
<td>
<font color="#008B9B" face="隶书" size=5>
<a name="概率论">概率论</a>
</td>
<td> 教室：一号公教楼JT204</br>
周数：1-12周</br>
节数： 周一、周三3-4节（10:25-12:00）</br>
老师：***讲师、***讲师</br>
简介：《概率论与数理统计》是一门研究和探索客观世界随机现象规律的数学学科。它以随机现象为研究对象,是数学的分支学科,在金融、保险、经济与企业管理、工农业生产、医学、地质学、气象与自然灾害预报等等方面都起到非常重要的作用。随着计算机科学的发展，以及功能强大的统计软件和数学软件的开发，这门学科得到了蓬勃的发展，它不仅形成了结构宏大的理论，而且在自然科学和社会科学的各个领域应用越来越广泛
</td>
</tr>
<tr>
<td>
<font color="#87CEEB" face="隶书" size=5>
<a name="马克思主义基本原理概论">马克思主义基本原理概论</a>
</td>
<td> 教室：一号公教楼503</br>
周数：1-16周</br>
节数：周四3-4节（10:25-12:00）</br>
老师：***讲师、***教授</br>
简介：《马克思主义基本原理概论》课程是按照《中共中央国务院关于进一-步加强和改进大学生思想政治教育的意见》(中发[2004]16号)和《中共中央宣传部教育部关于进一步加强和改进高等学校思想政治理论课的意见》(教社政[2005]5号)的精神设置的四门政治理论课其中的一一门。 根据上述文件精神，高等学校思想政治理论教材编写和课程教学的指导思想和基本要求是:“坚持用发展着的马克思主义武装大学生，始终保持教育教学的正确方向;坚持理论联系实际，贴近实际、贴近生活、贴近学生:坚持开拓创新，不断改进教育教学的内容、形式和方法。”
</td>
</tr>
<tr>
<td>
<font color="#6495ED" face="隶书" size=5>
<a name="大数据技术基础">大数据技术基础</a>
</td>
<td> 教室：一号公教楼JT202</br>
周数：1-16周</br>
节数：周二5-6节（13:30-15:05）</br>
老师：**副教授</br>
简介：《大数据技术基础》包括大数据概论、初识Hadoop、认识HDFS、HDFS的运行机制、访问HDFS、Hadoop I/O 详解、认识MapReduce编程模型、MapReduce应用编程开发、MapReduce的工作机制与YARN平台、MapReduce高级开发、MapReduce实例等知识，是计算机专业学生需要学习的课程
</td>
</tr>
<tr>
<td>
<font color="#6495ED" face="隶书" size=5>
<a name="大数据技术基础上机">大数据技术基础上机</a>
</td>
<td> 教室：机电楼</br>
周数：4-16周</br>
节数：周二7-8节（15:25-16:50）</br>
老师：**副教授</br>
简介：大数据技术基础上机实验是在《大数据技术基础》课程的前提下进行的上机实验
</td>
</tr>
<tr>
<td>
<font color="#008B8B" face="隶书" size=5>
<a name="大学体育">大学体育</a>
</td>
<td> 教室：艺体中心羽毛球馆</br>
周数：1-16周</br>
节数：周一7-8节（15:25-16:50）</br>
老师：**</br>
简介：大学体育课程主要是在体育课程教学计划的框架内，以竞技体育项目、民族传统体育项目和源自世界其它民族的传统体育项目设立若干个以体育基本理论知识、单项运动项目基本理论知识和运动技能为主要教学内容的公共修学课程。通过大学体育课程教学，使学生掌握运动项目基本知识与技能、指导学生运用运动项目科学锻炼身体、增强体质:培养学生的终身体育锻炼意识、习惯与能力;培养学生的良好体育精神、良好个性品质和社会交往能力等。
</td>
</tr>
<tr>
<td>
<font color="#6495ED" face="隶书" size=5>
<a name="大学英语">大学英语</a>
</td>
<td> 教室：一号公教楼206</br>
周数：2-17周</br>
节数：周五7-8节（15:25-16:50）</br>
老师：***讲师</br>
简介：《大学英语》是一门必修的公共基础课，是大学教育的一个重要组成部分。大学英语是以英语语言知识与应用技能、学习策略和跨文化交际为主要内容，以外语教学理论为指导，集多种教学模式和教学手段为一体的教学体系。本课程的教学目的在于培养学生的英语综合应用能力，特别是听说能力，使他们能以英语为工具有效地进行口头和书面的交流；同时增强其自主学习能力，提高综合文化素养，以适应我国社会发展和国际交流的需要。本课程实行学分制管理，学生必须按要求修满规定的学分。
</td>
</tr>
<tr>
<td>
<font color="##008B9B" face="隶书" size=5>
<a name="保险与生活">保险与生活</a>
</td>
<td> 教室：一号公教楼601</br>
周数：5周 12周</br>
节数：周一9-10节（17:50-20:30）</br>
老师：***</br>
简介：本课程采用论坛、基地PPT、访谈三种模式，以生动的语言表达、形象或准确的案例分析、专业的知识讲授向大家普及保险的基本知识，阐述生活中保险的重要作用及如何选择保险产品。课程讲述以生活中的风险开篇，主要分析风险的特征、要素、风险管理的方式、可保风险的条件，由此导出什么是保险、保险的特征、功能、作用，详细分析了保险合同中的专业术语如何理解、日常生活中常用保险产品简述、生活中人们对保险的差异认识该如何对待
</td>
</tr>
<tr>
<td>
<font color="#5F9EA0" face="隶书" size=5>
<a name="多媒体课件设计与制作">多媒体课件设计与制作</a>
</td>
<td> 教室：一号公教楼JT402</br>
周数：5周 12周</br>
节数：周四9-10节（17:50-20:30）</br>
老师：***讲师</br>
简介：本课程2017年获批黑龙江省精品在线开放课程，2018年获批国家精品在线开放课程，2019年获批黑龙江省线上线下混合式一流课程。多媒体课件设计与制作是以多媒体技术为基础，把计算机技术的交互性和可视化的真实感结合起来，使其应用并渗透到各个领域。本课程的目的与任务是使学生通过学习，掌握常用多媒体工具软件的使用方法、多媒体素材的加工制作过程以及教学软件开发的流程和方法，本课程具有较强的实践性。教学任务不仅在于知识的传递，更重视学生创新能力和实践能力的培养，要求学生能熟练掌握软件的使用方法，设计和开发出有价值的教育产品，来解决一些实际问题。
</td>
</tr>
</table>
</br>
</br>
</br>
</body></html>最终页面展示效果如下：
其中单击后会跳转到该课程的课程简介。由于课程简介里面涉及到了我老师的一些信息，所以我在这里就不展示剩下的页面啦！！！如果要引用的话记得注意其中的文件路径，是不一样哒！
就酱紫~
998
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
