作业分析
本次要使用table表格标签编写如下的效果
image
代码实现
使用html标签代码实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WEB第一次作业</title>
</head>
<body>
<table border="1" cellpadding="10" cellspacing="0" width="1500">
<tr>
<td>类型</td>
<td>角色</td>
<td>图片</td>
<td>技能</td>
</tr>
<tr>
<td rowspan="3">战士</td>
<td width="80">杨戬</td>
<td><a href="https://pvp.qq.com/web201605/herodetail/178.shtml" target="_blank">
<img src="https://tse1-mm.cn.bing.net/th/id/OIP-C._IeuVM8iD1CLS190D8vHcwHaDZ?rs=1&pid=ImgDetMain" alt="" width="400"></a></td>
<td>
<ol>
<li>被动：杨戬附近的每个敌方英雄都会使杨戬减少自身20%所受控制效果的持续时间，最多减少60%</li>
<li>一技能:杨戬召唤哮天犬并让其向指定方向发起冲锋，对第一个命中的敌人造成210/255/300/345/390/435（+45%物理加成）
点物理伤害，如果命中敌人，5秒内可再次释放该技能，释放后杨戬将冲向该敌人并发起一次攻击，造成320/395/470/545/620/695（+65%物理加成）
点物理伤害并附加目标已损生命值16%的物理伤害，对非英雄目标最多附加800伤害；若目标单位被击败则立即刷新一技能冷却时间。</li>
<li>二技能:杨戬向指定方向横扫，对范围内敌人造成250/300/350/400/450/500（+100%物理加成）
点物理伤害并减少50%移动速度，持续2秒；杨戬生命值百分比低于目标时造成1秒晕眩，若百分比高于目标，则造成0.5秒晕眩。命中敌人后，
杨戬的普通攻击将附带80/120/160/200/240/280（+35%物理加成）点真实伤害，持续5秒</li></th>
<li>三技能:杨戬利用天眼释放3次激光，对路径上的敌人造成300/450/600（+72%物理攻击）物理伤害，第3次将会发出3道激光，
同时被多道激光命中，从第二道激光开始只会造成30%的伤害。释放激光每次间隔不超过5秒，激光每次命中敌人时，
回复自身130/195/260（+33%物理攻击）点生命。同时被多道激光命中，从第二道激光开始只有回复50%的回复效果。</li>
</ol>
</td>
</tr>
<tr>
<td>吕布</td>
<td><a href="https://pvp.qq.com/web201605/herodetail/123.shtml" target="_blank">
<img src="https://c-ssl.duitang.com/uploads/blog/202301/05/20230105085657_10b2f.jpeg" alt="" width="400"></a></td>
<td>
<ol>
<li>被动：吕布挥斩方天画戟的技能命中敌方英雄后会给武器附魔，持续8秒。方天画戟在附魔状态下造成的是等额的真实伤害。
附魔状态下，吕布挥斩方天画戟的技能每命中一名敌方英雄，回复(+50％额外物理攻击)(+4%已损生命)点生命。
附魔状态下，吕布每次普攻命中敌人，回复(+25％额外物理攻击)(+1％已损生命)点生命。</li>
<li>一技能吕布向前挥斩方天画戟，造成500/635/770/905/1040/1175(+260％额外物理攻击)物理伤害。如果挥斩没有命中敌方英雄，
则方天画戟会立即失去附魔。：</li>
<li>二技能：吕布夺取范围内敌人的魂灵，造成30%减速，持续3秒。
每夺取一个魂灵，吕布获得175/220/265/310/355/400(+150％额外物理攻击)点护盾，护盾最多叠加3层。吕布每秒将当前25％的护盾转化为生命，
每2点护盾转化为1点生命。</li>
<li>三技能：吕布从天而降，圈定杀戮场展开杀戮，对范围内的敌人造成1秒击飞。落地后吕布奋力挥斩方天画戟，造成550/800/1050(+300％额外物理攻击)物理伤害。
吕布在杀戮场内获得150/200/250点物理和法术防御。触碰场地边缘的敌人会受到150/200/250(+87％额外物理攻击)物理伤害和50％减速，持续2秒
，若为英雄则还会为吕布额外回复(+50％额外物理攻击)(+4％已损生命)点生命。</li>
</ol>
</td>
</tr>
<tr>
<td>夏洛特</td>
<td><a href="https://pvp.qq.com/web201605/herodetail/536.shtml" target="_blank">
<img src="https://game.gtimg.cn/images/yxzj/zlkdatasys/ip/hero/ingame/image/20230418/16817851198307.jpg" alt="" width="400"></a></td>
<td>
<ol>
<li>被动：夏洛特任意技能命中敌人后，会将下次释放的其他技能强化为追加技，并获得一层印记，持续4秒。叠满3层印记后普攻将强化为追加技【七星光芒剑】，
追击锁定敌人打出7段伤害，每段造成50(+25%物理攻击)物理伤害和20%减速，最后一段额外造成12%已损生命的物理伤害，释放期间获得21%~35%免伤（
随等级成长）。追加技对敌人附带伤残效果，每层减少10%攻速，持续4秒，最多叠加2层，伤残效果随敌方每次普攻移除一层。</li>
<li>起手技：短暂延迟后，夏洛特向指定方向释放迅光三角剑，对路径上的敌人造成物理伤害，对路径上的敌人造成200(+100%物理攻击)物理伤害，
命中后增加80%持续衰减的移速，持续2秒。</li>
<li>起手技：夏洛特向指定方向冲刺，同时快速刺击六次，每段造成40（+15%物理攻击）物理伤害，并回复27（+12%物理攻击）点生命。</li>
<li>起手技：原地画出七道剑痕，每道剑痕造成150/250/350( +70%物理攻击)物理伤害和50%减速，持续1秒，从第二道剑痕开始将只造成30%伤害，
技能释放期间处于霸体状态，并获得免伤被动。</li>
</ol>
</td>
</tr>
</table>
</body>
</html>
个人总结
table表格标签可以将内容以表格的形式展示出来，直观间洁。
