作业练习：从菜谱跳转到课程表

菜谱：

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>菜谱跳转练习</title>
</head>
<body>
<table border="1px" cellspacing="0px" style="border-color: red" align="left">
    <caption>菜谱跳转练习,我是table的标题</caption>
    <tr>
        <th colspan="3">星期一菜单</th>
    </tr>
    <tr>
        <td rowspan="2">素菜</td>
        <td>青草茄子</td>
        <td>花椒扁豆</td>
    </tr>
    <tr>
        <td>小葱豆腐</td>
        <td>炒白菜</td>
    </tr>
    <tr>
        <td rowspan="2">荤菜</td>
        <td>油焖大虾</td>
        <td>海参鱼翅</td>
    </tr>
    <tr>
        <td>红烧肉
            <a href="课程表.html" target="_blank"><img src="https://ss1.baidu.com/6ONXsjip0QIZ8tyhnq/it/u=2846773786,1909168706&fm=58" alt="红烧肉" title="红烧肉" width="150px" height="150px"></a>
        </td>
        <td>烤全羊</td>
    </tr>
</table>

</body>
</html>
复制代码

效果是：

菜谱跳转练习,我是table的标题
星期一菜单
素菜 青草茄子 花椒扁豆
小葱豆腐 炒白菜
荤菜 油焖大虾 海参鱼翅
红烧肉 红烧肉 烤全羊

 

 

 

 

 

 

 

 

 

 

点击图片，跳转到课程表：

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>课程表</title>
</head>
<body>
    <table id="kechengbiao" border="1px" cellspacing="5px" cellpadding="10px" style="border-color: blue"  >
        <caption>课程表</caption>
        <tr >
               <th>项目</th>
               <th colspan="6" align="center">上课</th>
               <th>休息</th>
        </tr>
        <tr>
            <th>星期</th>
            <th>星期一</th>
            <th>星期二</th>
            <th>星期三</th>
            <th>星期四</th>
            <th>星期五</th>
            <th>星期六</th>
            <th>星期日</th>
        </tr>
        <tr>
            <td rowspan="4">上午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td rowspan="4">休息</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>英语</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td>语文</td>
        </tr>
        <tr>
            <td>英语</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td>语文</td>
            <td>数学</td>
        </tr>
        <tr>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
        </tr>
        <tr>
            <td rowspan="2">下午</td>
            <td>语文</td>
            <td>数学</td>
            <td>英语</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td rowspan="2">休息</td>
        </tr>
        <tr>
            <td>数学</td>
            <td>英语</td>
            <td>物理</td>
            <td>化学</td>
            <td>生物</td>
            <td>语文</td>
        </tr>
    </table>
</body>
</html>
复制代码
课程表
项目上课休息
星期星期一星期二星期三星期四星期五星期六星期日
上午 语文 数学 英语 物理 化学 生物 休息
数学 英语 物理 化学 生物 语文
英语 物理 化学 生物 语文 数学
物理 化学 生物 语文 数学 英语
下午 语文 数学 英语 物理 化学 生物 休息
数学 英语 物理 化学 生物 语文
posted @   大川哥  阅读(235)  评论(0)  编辑  收藏  举报
编辑推荐：
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
阅读排行：
· 被坑几百块钱后，我竟然真的恢复了删除的微信聊天记录！
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单，K8s 太复杂？w7panel 让容器管理更轻松！
点击右上角即可分享
微信分享提示