<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <script src="icon-font/iconfont.js"></script></head><body> <style> @media (max-width:300px) { html { font-size: 12px; } } @media (min-width:301px) and (max-width:600px) { :root { font-size: 14px; } } @media (min-width:601px) { :root { font-size: 16px; } } body { margin: 0; padding: 0; } table { width: 90vw; border-collapse: collapse; border-spacing: 0; margin: 5vw; } table caption { font-size: 2rem; font-weight: bold; margin-bottom: 10px; } table thead tr { background-color: coral; } table tr th { font-size: 1.2rem; line-height: 3rem; border: 1px solid rgb(151, 79, 7); text-align: center; } table tr:nth-of-type(2n) { background-color: blanchedalmond; } *[rowspan] { background-color: #fff; } table tbody tr:hover { background-color: burlywood; cursor: pointer; transition-duration: 0.6s; } .icon { width: 1.2em; height: 1.2em; vertical-align: -0.15em; fill: currentColor; overflow: hidden; } </style> <table> <caption> 课程表 </caption> <thead> <tr> <th>时间</th> <th>周一</th> <th>周二</th> <th>周三</th> <th>周四</th> <th>周五</th> </tr> </thead> <tbody> <tr> <th rowspan="4">上午</th> <th> <svg class="icon" aria-hidden="true"> <use xlink:href="#icon-huiyuan"></use> </svg>数学 </th> <th>数学</th> <th>数学</th> <th>数学</th> <th>数学</th> </tr> <tr> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-biji"></use> </svg>语文</th> <th>语文</th> <th>语文</th> <th>语文</th> <th>语文</th> </tr> <tr> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-shoucang"></use> </svg>英语</th> <th>英语</th> <th>英语</th> <th>英语</th> <th>英语</th> </tr> <tr> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-xiaoxi"></use> </svg>体育</th> <th>体育</th> <th>体育</th> <th>体育</th> <th>体育</th> </tr> <tr> <th colspan="6">中午休息</th> </tr> <tr> <th rowspan="3">下午</th> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-ziliao"></use> </svg>音乐</th> <th>音乐</th> <th>音乐</th> <th>音乐</th> <th>音乐</th> </tr> <tr> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-xihuan"></use> </svg>美术</th> <th>美术</th> <th>美术</th> <th>美术</th> <th>美术</th> </tr> <tr> <th><svg class="icon" aria-hidden="true"> <use xlink:href="#icon-huiyuan"></use> </svg>生理</th> <th>生理</th> <th>生理</th> <th>生理</th> <th>生理</th> </tr> <tr> <th>执勤</th> <th colspan="5">各小组安排</th> </tr> </tbody> </table></body></html>
