WEB第一次作业
作业目标：使用表格介绍英雄信息
屏幕截图 2024-12-14 181351.png
作业介绍
通过列出英雄分位，技能，被动，名称对读者进行英雄的介绍
作业详情
点击英雄名称查看英雄详细信息
点击英雄图片查看英雄超燃视频
左下角点击播放，播放主题曲
代码实现
通过Vscode编写html代码实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第一个表格网页</title>
</head>
<body>
<table border="1" cellpadding="30" cellspacing="0" width="2000"
background="https://img0.baidu.com/it/u=3435051965,2886847348&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500" align="center">
<th>类型</th>
<th>图片</th>
<th width="300px">英雄</th>
<th width="1000px">被动</th>
<th width="600px">技能</th>
</tr>
<tr>
<td rowspan="2">ADC(射手)</td>
<td><a href="https://www.kuaishou.com/short-video/3xmccd5n99w6p84?authorId=3xfirqtmen9847c&streamSource=search&area=searchxxnull&searchKey=uzi%E5%8E%84%E6%96%90%E7%90%89%E6%96%AF" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/f0f43179-e2d1-40f5-84e0-0ae82bf2adc0.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=523&datatype=5v5" target="_blank">残月之肃(厄斐琉斯)</td>
<td>通碧：还魂月闪,短魄：擘分对影,坠明：地霜暗蚀,莹焰：地霜瞑涌，折镜：还魂驻灵</td>
<td>Q:月银之刃,W:月相轮转,E:武器队列系统,R:清辉夜凝</td>
</tr>
<tr>
<td><a href="https://v.qq.com/x/page/l147891lxtl.html" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/f58e8c85-9100-4cb7-abab-2635f9d4a787.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=119&datatype=5v5" target="_blank">荣耀行刑官(德莱文)</td>
<td>德莱文联盟:每接住一柄旋转飞斧或击败一个敌方单位,将获得一层崇拜效果。击败英雄时,获得额外赏金并消耗所有崇拜层数</td>
<td>Q:旋转飞斧,W:血性冲刺,E:开道利斧,R:冷血追命</td>
</tr>
<tr>
<td rowspan="2">APC(中单)</td>
<td><a href="https://www.douyin.com/video/7432769476531162404" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/cbe8e557-6b38-4478-ae6f-9b03f10fb4d5.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=3&datatype=5v5" target="_blank">正义巨像(加里奥)</td>
<td>巨像重击:被动技能，每过若干秒，加里奥的下次普攻会对周围敌人造成额外魔法伤害，并获得攻速提升</td>
<td>Q:战争罡风,W:杜朗护盾,E:正义冲拳,R:英雄登场</td>
</tr>
<tr>
<td><a href="https://www.bilibili.com/video/BV1wS4y1P7u9?t=47.0" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/23b8e9d6-e81c-47fa-9b96-491dd2d1f2d2.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=157&datatype=5v5" target="_blank">疾风剑豪(亚索)</td>
<td>被动技能:浪客之道亚索在移动时会积攒剑意,移动速度越快,剑意积攒得越快,当剑意槽充满时,亚索在受到来自英雄或野怪的伤害时,会获得一个吸收125-600点伤害的护盾</td>
<td>Q:斩钢闪,W:风之障壁,E:踏前斩,R:狂风绝息斩</td>
</tr>
<tr>
<td rowspan="2">TOP(上单)</td>
<td><a href="https://www.kuaishou.com/short-video/3x43idai3jy26zc?authorId=3xc5mk6ntms4qr4&streamSource=search&area=searchxxnull&searchKey=theshy%E5%A4%A9%E4%BD%BF%E5%A4%A7%E9%97%AA30%E7%A7%92%E5%89%AA%E8%BE%91" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/88faca40-76aa-4f01-a5a1-b413831fc538.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=10&datatype=5v5" target="_blank">正义天使(凯尔)</td>
<td>登神长阶：在普通攻击或三技能攻击到敌方单位时,攻击速度会提高,最多叠五层。5级后变为远程英雄,10级后普通攻击附带热浪效果,15级后普通攻击直接默认附带热浪效果</td>
<td>Q:耀焰冲击,W:星界恩典,E:星火符刃,R:圣裁之刻</td>
</tr>
<tr>
<td><a href="https://www.kuaishou.com/short-video/3xyibhr7t3rcpyy?authorId=3xy74g9tmuwd8vs&streamSource=search&area=searchxxnull&searchKey=%E7%91%9E%E6%96%87%E8%B6%85%E7%84%B6%E5%89%AA%E8%BE%91" target="_blank">
<img width="200px" height="auto"
src="https://game.gtimg.cn/images/lol/act/img/skinloading/0677b45f-05a1-4286-820e-904397c78cfa.jpg"/></td>
<td><a href="https://101.qq.com/#/hero-detail?heroid=92&datatype=5v5" target="_blank">放逐之刃(锐雯)</td>
<td>符文之刃：瑞文的技能将为她的剑刃充能,使她的下一次普通攻击造成额外伤害。最多可以充能三次,但每次攻击只会消耗掉一层充能</td>
<td>Q:折翼之舞,W:震魂怒吼,E:勇往直前,R:放逐之锋</td>
</tr>
</table>
<audio src="./英雄联盟 - 涅槃 (Phoenix).ogg" autoplay="autoplay" loop="loop" controls><audio/>
</body>
</html>
代码效果展示
屏幕截图 2024-12-14 181508.png
