HTML系列教材（十六）- 基本元素

下载区
文件名	文件大小
images.rar	30k
answer.rar	31k
解压rar如果失败，请用5.21版本或者更高版本的winrar 点击下载 winrar5.21

工具版本兼容问题

本练习将用到后续的知识点图像,表格，需要的图片在右侧下载images.rar。

答案在answer.rar中。尽量自己先完成，然后再参考答案

纠

步骤 1 :

练习效果图

edit 顶折

纠问

姿势不对,事倍功半! 点击查看做练习的正确姿势

HTML系列教材（十五）- 基本元素 - 的下划线标签 <ins>

HTML系列教材（十七）- 基本元素 - 的图像标签<img> 详解

HOW2J公众号，关注后实时获知最新的教程和优惠活动，谢谢。

问答区域

2024-07-22 表格和图片标签实现LOL介绍

虚心求学

关于前端部分-HTML-阶段性练习2 的提问

主要为表格，表格中有文字说明和图片

<h1 align = "left">英雄联盟  （电子竞技类游戏）</h1>
<span><strong>《英雄联盟》</strong>（简称 lol ）是由美国<em> Riot Games </em>开发，中国大陆地区由腾讯公司运营的网络游戏。</span>
<br/>
<br/>
<table width = "90%" border = "1">
  <tr bgcolor = "#ddd">
   <td width = "15%"><strong>技能名</strong></td>
    <td width = "6%"><strong>触发</strong></td>
    <td width = "8%"><strong>技能属性</strong></td>
    <td width = "55%"><strong>技能效果</strong></td>
    <td width = "10%">图标</td>
  </tr>
  <tr height = "18%">
    <td><strong>坚韧</strong></td>
  <td><strong>被动</strong></td>
      <td colspan = "2">盖伦如果在9秒内不受到任何伤害，之后的每秒都会回复自己最大生命值的0.4%。小兵的伤害不会中断坚韧效果。</td>
        <td align = "center"><img src = "skill1.png"></td>
  </tr>
    <tr >
    <td><strong>致命打击</strong></td>
    <td><strong>Q</strong></td>
    <td>冷却时间：8</td>
    <td>盖伦移除身上的所有减速效果，并获得30%移动速度加成，持续1.5/2/2.5/3/3.5秒。
<br/>在接下来的4.5秒内，他的下次普通攻击会造成30/55/80/105/130(+1.4AD)物理伤害，并沉默目标1.5秒。	</td>
  <td align = "center"><img src = "skill2.png"></td>
  </tr>
    <tr>
    <td><strong>勇气</strong></td>
    <td><strong>W</strong></td>
    <td>冷却：24/23/22/21/20</td>
    <td><strong>被动：</strong>击杀一个单位会永久提供0.25护甲和魔法抗性加成，最大值：30
<br/><strong>主动：</strong>盖伦获得一个持续2/3/4/5/6秒的防御护盾，减少即将到来的30%伤害。</td>
    <td align = "center"><img src = "skill3.png"></td>
  </tr>
    <tr>
    <td><strong>审批</strong></td>
    <td><strong>E</strong></td>
    <td>冷却：9</td>
    <td>盖伦快速地旋舞大剑，持续3秒，在持续期间对周围敌人总共造成物理伤害——14/18/22/26/30加上他总攻击力的34/35/36/37/38%，5次(英雄每升3级加1次)。
<br/>E【审判】会在攻击单个敌人时造成33%额外伤害。
<br/>取消E【审判】会返还相当于剩余持续时长的冷却时间。
<br/>E【审判】可以暴击，并造成额外伤害。</td>
  <td align = "center"><img src = "skill4.png"></td>
  </tr>
    <tr>
    <td><strong>德玛西亚正义</strong></td>
    <td><strong>R</strong></td>
    <td>冷却：120/100/80</td>
    <td><strong>被动：</strong>最近获得最多击杀数的敌人会成为<strong>大反派</strong>。盖伦的E【审判】和普攻会对<strong>大反派</strong>造成额外真实伤害，伤害值为大反派1%的最大生命值。
<br/><strong>主动：</strong>盖伦召唤德玛西亚之力，试图斩杀一名敌方英雄，目标损失的生命越多，则此技能造成的伤害越高。造成175/350/525魔法伤害加上目标已损失生命值的28/33/40%。对<strong>大反派</strong>造成真实伤害。</td>
  <td align = "center"><img src = "skill5.png"></td>
  </tr>
<table>

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2022-05-20 答案

fujava

关于前端部分-HTML-阶段性练习2 的提问

练习答案

<!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>
</head>

<body>
    <div>
        <h2>英雄技能</h2>
    </div>
    <div>
        <table border="1" width="800px">
            <tr bgcolor = "#ddd">
                <td width="100px">
                    <strong>技能名</strong>
                </td>
                <td width="50px">
                    <strong>触发</strong>
                </td>
                <td>
                    <strong>技能属性</strong>
                </td>
                <td>
                    <strong>技能效果</strong>
                </td>
                <td width="50px">
                    <strong>图标</strong>
                </td>
            </tr>
            <tr valign="middel">
                <td><strong>坚韧</strong> </td>
                <td><strong>被动</strong></td>
                <td colspan="2">盖伦如果在9秒内不受到任何伤害，之后的每秒都会回复自己最大生命值的0.4%。小兵的伤害不会中断坚韧效果</td>
                <td><img src="images\skill1.png" alt="坚韧"></td>
            </tr>
            <tr>
                <td><strong>致命打击</strong></td>
                <td><strong>Q</strong></td>
                <td>冷却时间：8</td>
                <td>盖伦移除身上的所有减速效果，并获得30%移动速度加成，持续1.5/2/2.5/3/3.5秒。
                    在接下来的4.5秒内，他的下次普通攻击会造成30/55/80/105/130(+1.4AD)物理伤害，并沉默目标1.5秒
                </td>
                <td><img src="images/skill2.png" alt="致命打击"></td>
            </tr>
            <tr>
                <td><strong>勇气</strong></td>
                <td><strong>W</strong></td>
                <td>冷却：24/23/22/21/20</td>
                <td>被动：击杀一个单位会永久提供0.25护甲和魔法抗性加成，最大值：30
                    主动：盖伦获得一个持续2/3/4/5/6秒的防御护盾，减少即将到来的30%伤害。</td>
                <td> <img src="images/skill3.png" alt="勇气"></td>
            </tr>
            <tr>
                <td><strong>审判</strong></td>
                <td><strong>E</strong></td>
                <td> 冷却：9</td>
                <td>盖伦快速地旋舞大剑，持续3秒，在持续期间对周围敌人总共造成物理伤害——14/18/22/26/30加上他总攻击力的34/35/36/37/38%，
                    5次(英雄每升3级加1次)。
                    E【审判】会在攻击单个敌人时造成33%额外伤害。
                    取消E【审判】会返还相当于剩余持续时长的冷却时间。
                    E【审判】可以暴击，并造成额外伤害。</td>
                <td><img src="images/skill4.png" alt="审判"></td>
            </tr>
            <tr>
                <td><strong>勇气</strong></td>
                <td><strong>R</strong></td>
                <td>冷却：120/100/80</td>
                <td>被动：最近获得最多击杀数的敌人会成为大反派。盖伦的E【审判】和普攻会对大反派造成额外真实伤害，伤害值为大反派1%的最大生命值。
                    主动：盖伦召唤德玛西亚之力，试图斩杀一名敌方英雄，目标损失的生命越多，则此技能造成的伤害越高。造成175/350/525魔法伤害加上目标已损失生命值的28/33/40%。对大反派造成真实伤害。
                </td>
                <td><img src="images/skill5.png" alt="勇气"></td>
            </tr>
        </table>
    </div>
</body>

</html>

1 个答案

LUO萝北
答案时间：2023-05-29

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <h3>英雄技能</h3> <table border="1px"> <tr bgcolor="gray"> <th>技能名</th> <th>触发</th> <th>技能属性</th> <th>技能效果</th> <th>图标</th> </tr> <tr> <td>坚韧</td> <td>被动</td> <td>无</td> <td>盖伦如果在9秒内不受到任何伤害。。。</td> <td><img src="D:\install\WONIU-J-Install\practiceProject\htmlDay02how2j\skill1.png" alt=""></td> </tr> <tr> <td>坚韧</td> <td>被动</td> <td>无</td> <td>盖伦如果在9秒内不受到任何伤害。。。</td> <td><img src="D:\install\WONIU-J-Install\practiceProject\htmlDay02how2j\skill2.png" alt=""></td> </tr> <tr> <td>坚韧</td> <td>被动</td> <td>无</td> <td>盖伦如果在9秒内不受到任何伤害。。。</td> <td><img src="D:\install\WONIU-J-Install\practiceProject\htmlDay02how2j\skill3.png" alt=""></td> </tr> <tr> <td>坚韧</td> <td>被动</td> <td>无</td> <td>盖伦如果在9秒内不受到任何伤害。。。</td> <td><img src="D:\install\WONIU-J-Install\practiceProject\htmlDay02how2j\skill4.png" alt=""></td> </tr> </table> </body> </html>

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2022-05-07 阶段性练习2答案

bobtick

关于前端部分-HTML-阶段性练习2 的提问

自己答案

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<title>英雄技能介绍</title>
	</head>
	
	<body>
		<h2>英雄技能</h2>
		<table border="1" width="768px">
			<tr bgcolor="#DCDCDC">
				<td width="15%"><strong>技能名</strong></td>
				<td width="8%"><strong>触发</strong></td>
				<td width="12%"><strong>技能属性</strong></td>
				<td width="57%"><strong>技能效果</strong></td>
				<td width="8%">图标</td>
			</tr>
			<tr>
				<td><strong>坚韧</strong></td>
				<td><strong>被动</strong></td>
				<td colspan="2">
					盖伦如果在9秒内不受到任何伤害，
					之后的每秒都会回复自己最大生命值的0.4%。
					小兵的伤害不会中断坚韧效果。
				</td>
				<td><img src="skill1.png" alt="skill1" width="65" height="65"/></td>
			</tr>
			<tr>
				<td><strong>致命打击</strong></td>
				<td><strong>Q</strong></td>
				<td>冷却时间：8</td>
				<td>
					盖伦移除身上的所有减速效果，并获得30%移动速度加成，
					持续1.5/2/2.5/3/3.5秒。<br/>在接下来的4.5秒内，
					他的下次普通攻击会造成30/55/80/105/130(+1.4AD)物理伤害，并沉默目标1.5秒。
				</td>
				<td><img src="skill2.png" alt="skill2" width="65" height="65"/></td>
			</tr>
			<tr>
				<td><strong>勇气</strong></td>
				<td><strong>W</strong></td>
				<td>冷却：24/23/22/21/20</td>
				<td>
					<strong>被动：</strong>
					击杀一个单位会永久提供0.25护甲和魔法抗性加成，最大值：30<br/>
					<strong>主动：</strong>
					盖伦获得一个持续2/3/4/5/6秒的防御护盾，减少即将到来的30%伤害。
				</td>
				<td><img src="skill3.png" alt="skill3" width="65" height="65"/></td>
			</tr>
			<tr>
				<td><strong>审判</strong></td>
				<td><strong>E</strong></td>
				<td>冷却：9</td>
				<td>
					盖伦快速地旋舞大剑，持续3秒，在持续期间对周围敌人总共造成物理伤害
					——14/18/22/26/30加上他总攻击力的34/35/36/37/38%，5次(英雄每升3级加1次)。<br/>
					E【审判】会在攻击单个敌人时造成33%额外伤害。<br/>
					取消E【审判】会返还相当于剩余持续时长的冷却时间。<br/>
					E【审判】可以暴击，并造成额外伤害。<br/>
				</td>
				<td><img src="skill4.png" alt="skill4" width="65" height="65"/></td>
			</tr>
			<tr>
				<td><strong>德玛西亚正义</strong></td>
				<td><strong>R</strong></td>
				<td>冷却：120/100/80</td>
				<td>
					<strong>被动：</strong>
					最近获得最多击杀数的敌人会成为<strong>大反派</strong>。
					盖伦的E【审判】和普攻会对<strong>大反派</strong>造成额外真实伤害，
					伤害值为<strong>大反派</strong>1%的最大生命值。<br/>
					<strong>主动：</strong>
					盖伦召唤德玛西亚之力，试图斩杀一名敌方英雄，目标损失的生命越多，
					则此技能造成的伤害越高。造成175/350/525魔法伤害加上目标已损失生命值的28/33/40%。
					对<strong>大反派</strong>造成真实伤害。
				</td>
				<td><img src="skill5.png" alt="skill5" width="65" height="65"/></td>
			</tr>
		</table>
	</body>
</html>

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2022-02-24 练习-效果图

起个名

关于前端部分-HTML-阶段性练习2 的提问

效果图

<h2>英雄技能<h2>
<table border="1">
	<tr bgcolor="gray">
		<td width="100px" height="30px"><b>技能名</b></td>
		<td width="50px" height="30px"><b>触发</b></td>
		<td width="120px" height="30px"><b>技能属性</b></td>
		<td width="600px" height="30px"><b>技能效果</b></td>
		<td width="60px" height="30px">图标</td>
	</tr>
		
	<tr>
		<td><b>坚韧</b></td>
		<td><b>被动</b></td>
		<td colspan="2">盖伦如果在9秒内不受到任何伤害，之后的每秒都会回复自己最大生命值的0.4%。小兵的伤害不会中断坚韧效果。</td>
		<td><img src=".../skill1.png"></td>
	</tr>
	
	<tr>
		<td><b>致命打击</b></td>
		<td><b>Q</b></td>
		<td>冷却时间: 8</td>
		<td>盖伦移除身上的所有减速效果，并获得30%移动速度加成，持续1.5/2/2.5/3/3.5秒，在接下来的4.5秒内，他的下次普通攻击会造成30/55/80/105/130(+1.4AD)物理伤害，并沉默目标1.5秒。</td>
		<td><img src=".../skill2.png"></td>
	</tr>
	
	<tr>
		<td><b>勇气</b></td>
		<td><b>W</b></td>
		<td>冷却: 24/23/22/21/20</td>
		<td><b>被动：</b>击杀一个单位会永久提供0.25护甲和魔法抗性加成，最大值：30</br><b>主动：</b>盖伦获得一个持续2/3/4/5/6秒的防御护盾，减少即将到来的30%的伤害。</td>
		<td><img src=".../skill3.png"></td>
	</tr>
	
	<tr>
		<td><b>审判</b></td>
		<td><b>E</b></td>
		<td>冷却：24/23/22/21/20</td>
		<td>盖伦快速的旋舞大剑，持续3秒，在持续期间对周围敌人总共造成物理伤害-14/18/22/26/30加上他总攻击力的34/35/36/37/38%,5次(英雄每升3级加1次)。</br>E【审判】会在攻击单个敌人时造成33%额外伤害。</br>取消E【审判】会返还相当于剩余持续时长的冷却时间。</br>E【审判】可以暴击，并造成额外伤害。</td>
		<td><img src=".../skill4.png"></td>
	</tr>
	
	<tr>
		<td><b>德玛西亚正义</b></td>
		<td><b>R</b></td>
		<td>冷却：120/100/80</td>
		<td><b>被动：</b>最近获得最多击杀数的敌人会成为<b>大反派</b>。盖伦的E【审判】和普攻会对<b>大反派</b>造成额外真实伤害,伤害值为<b>大反派</b>1%的最大生命之值。</br><b>主动：</b>盖伦召唤德玛西亚之力，试图斩杀一名敌方英雄，目标损失的生命越多，，则此技能造成的伤害越高，造成175/350/525魔法伤害加上目标已损失生命值的28/33/40%。对<b>大反派</b>造成真实伤害。</td>
		<td><img src="...2/skill5.png"></td>
	</tr>
</table>

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2021-06-19 我的

Genius_Wang

关于前端部分-HTML-阶段性练习2 的提问

有些浏览器显示布局不一样，有时要改长宽挺麻烦的

<head>
    <meta charset="uft-8">
</head>
<html
<body>
   <table border="1" >
        <tr bgcolor="#c0c0c0" height="10px">
            <td width="17%"><b>技能名</b></td>
            <td width="8%"><b>触发</b></td>
            <td width="13%"><b>技能属性</b></td>
            <td width="50%"><b>技能效果</b></td>
            <td width="8%">图标</td>
        </tr>
        <tr height="10px">
            <td><b>坚韧</b></td>
            <td><b>被动</b></td>
            <td colspan="2">盖伦如果在秒内不受到任何伤害,之后的每秒都会回复自己最大生命值的0.4%。小兵的伤害不会中断坚韧效果。</td>
            <td align="center"><img src="skill1.png"</td>
        </tr>
        <tr>
            <td width="17%"><b>致命打击</b></td>
            <td width="8%"><b>Q</b></td>
            <td width="13%">冷却时间：8</td>
            <td width="50%">盖伦移除身上的所有减速效果，并获得30%移动速度加成，持续1.5/2/2.5/3/3.5秒。<br/>
                在接下来的4.5秒内，他的下次普通攻击会造成30/55/80/105/130(+1.4AD)物理伤害，并沉默目标1.5秒。</b></td>
            <td align="center"><img src="skill2.png"></td>
        </tr>
        <tr>
            <td width="17%"><b>勇气</b></td>
            <td width="8%"><b>W</b></td>
            <td width="13%">冷却：24/23/22/21/20</td>
            <td width="50%"><b>被动：</b>击杀一个单位会永久提供0.25护甲和魔法抗性加成，最大值:30<br/>
                    <b>主动:</b>盖伦获得一个持续2/3/4/5/6秒的防御护盾,减少即将到来的30%伤害。</td>
            <td align="center"><img src="skill3.png"></td>
        </tr>
        <tr>
            <td width="17%"><b>审判</b></td>
            <td width="8%"><b>E</b></td>
            <td width="13%">冷却：9</td>
            <td width="50%">盖伦快速地旋舞大剑,持续3秒,在持续期间对周围敌人总共造成物理伤害————14/18/22/26/30加上他总攻击力的34/35/36/37/38%，五次(英雄等级每升3级加一次)。<br>
                    E【审判】会在攻击单个敌人时造成33%额外伤害。<br/>
                    取消E【审判】会返还相当于剩余持续时长的冷却时间。<br/>
                    E【审判】可以暴击，并造成额外伤害。</td>
            <td align="center"><img src="skill4.png"></td>
        </tr>
        <tr>
            <td width="17%"><b>德玛西亚正义</b></td>
            <td width="8%"><b>R</b></td>
            <td width="13%">冷却：120/100/80</td>
            <td>width="50%"><b>被动：</b>最近获得最大击杀的敌人会成为<b>大反派</b>，盖伦的E【审判】和普通攻击会对<b>大反派</b>造成额外真实伤害，伤害值为<b>大反派</b>1%的最大生命值。<br />
            <b>主动:</b>盖伦召唤德玛西亚之力，试图斩杀一名敌方英雄，目标损失的生命越多，则此技能造成的伤害越高。造成175/350/525魔法伤害加上目标已损失生命值的28/33/40%。对<b>大反派</b>造成真实伤害。</td>
            <td align="center"><img src="skill5.png"></td>
        </tr>
   </table>
    </body>
</html>
<!-- 2160，1440 1080，1920 -->

1 个答案

王菜菜
答案时间：2021-11-13

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <h1>英雄技能</h1> <table border="2"> <tr style="width: 60px; background-color: darkgray;"> <td style="width: 120px;">技能名</td> <td style="width: 40px;">触发</td> <td style="width: 50px;">技能属性</td> <td style="width: 300px;">技能效果</td> <td style="width: 80px;">图标</td> </tr> <tr style="height: 60px;"> <td>坚韧</td> <td>被动</td> <td colspan="2，3">向前出剑，造成20/40/60/80/100(+100% 总攻击力)物理伤害。在命中时，斩钢闪会获得一层旋风烈斩效果，持续10秒。在积攒2层旋风烈斩效果后，斩钢闪会形成一阵能够击飞敌人的旋风。</td> <td>懒得加了</td> </tr> <tr style="height: 60px;"> <td>致命打击</td> <td>0</td> <td>冷却时间：8</td> <td>斩钢闪被视为普通攻击：它可以暴击，附带攻击特效，会被控制效果所中断，并且它的冷却时间和施法时间都会从攻击速度上获得收益。如果在突进的过程中施放斩钢闪，那么斩钢闪就会呈环状出剑。</td> <td>懒得加了</td> </tr> <tr style="height: 60px;"> <td>勇气</td> <td>W</td> <td>冷却：24/23/22 /21/20</td> <td>形成一个气流之墙，来阻挡敌方的飞行道具。</td> <td>懒得加了</td> </tr> <tr style="height: 60px;"> <td>审判</td> <td>E</td> <td>冷却：9</td> <td>进有E技能突进，退有W技能防守;既有控制、又有爆发，可谓输出与防御兼备的刺客。团战收割能力极强，AOE输出也颇为可观。</td> <td>懒得加了</td> </tr> <tr style="height: 60px;"> <td>德玛西亚正义</td> <td>R</td> <td>冷 却:120/100/80</td> <td>向目标敌人突进，造成60/70/80/90/100(+0.2*额外AD)魔法伤害。每次施法都会使你的下一次突进的基础伤害提升25%，最多提升至50%。在10/9/8/7/6秒内无法对相同敌人重如果在突进的过程中施放斩钢闪，那么斩钢闪就会呈环状出剑。</td> <td></td> </tr> </table> </body> </html>

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

提问太多，页面渲染太慢，为了加快渲染速度，本页最多只显示几条提问。还有 35 条以前的提问，请点击查看

提问之前请登陆

提问已经提交成功，正在审核。请于我的提问处查看提问记录，谢谢

关于前端部分-HTML-阶段性练习2 的提问

尽量提供截图、代码和异常信息，有助于分析和解决问题。也可进本站QQ群交流: 578362961

提问尽量提供完整的代码，环境描述，越是有利于问题的重现，您的问题越能更快得到解答。
对教程中代码有疑问，请提供是哪个步骤，哪一行有疑问，这样便于快速定位问题，提高问题得到解答的速度
在已经存在的几千个提问里，有相当大的比例，是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。
请使用和站长一样的版本，可以节约自己大量的学习时间。站长把教学中用的软件版本整理了，都统一放在了这里，方便大家下载： https://how2j.cn/k/helloworld/helloworld-version/1718.html

上传截图