测试您的技能:链接
本技能测试的目的是评估您是否理解如何在 HTML 中实现超链接。 在 HTML 中实现超链接。
任务 1
在这个任务中,我们希望您帮助填写我们鲸鱼信息页面的链接。
- 第一个链接应链接到名为
whales.html
的页面,该页面与当前页面位于同一目录中。 - 我们还希望您在鼠标悬停时为其提供工具提示,告诉用户该页面包含有关蓝鲸和抹香鲸的信息。
- 第二个链接应该变成一个可点击的链接,以在用户的默认邮件应用程序中打开一封电子邮件,收件人设置为 "[email protected]"。
- 如果您还将其设置为自动将电子邮件主题行填充为“关于鲸鱼的问题”,您将获得一个加分项。
注意: 示例中的两个链接都设置了 target="_blank"
属性。这并非严格意义上的最佳做法,但我们在这里这样做是为了防止链接在嵌入的 <iframe>
中打开,从而避免您的示例代码丢失!
尝试更新下面的实时代码以重新创建完成的示例。
下载此任务的起点 以在您自己的编辑器或在线编辑器中进行操作。
任务 2
在这个任务中,我们希望您填写四个链接,使它们链接到相应的位置。
- 第一个链接应链接到名为
blue-whale.jpg
的图像,该图像位于当前目录内的名为blue
的目录中。 - 第二个链接应链接到名为
narwhal.jpg
的图像,该图像位于名为narwhal
的目录中,该目录位于当前目录的上一级目录中。 - 第三个链接应链接到英国 Google 图片搜索。基本 URL 为
https://www.google.co.uk
,图片搜索位于名为imghp
的子目录中。 - 第四个链接应链接到当前页面最底部的段落。它有一个 ID 为
bottom
。
注意: 示例中的前三个链接都设置了 target="_blank"
属性,以便当您单击它们时,它们会在新标签页中打开链接的页面。这并非严格意义上的最佳做法,但我们在这里这样做是为了防止页面在嵌入的 <iframe>
中打开,从而避免您的示例代码丢失!
尝试更新下面的实时代码以重新创建完成的示例。
下载此任务的起点 以在您自己的编辑器或在线编辑器中进行操作。
任务 3
以下链接链接到关于独角鲸的信息页面、支持电子邮件地址以及大小为 4MB 的 PDF 信息文件。在这个任务中,我们希望您
- 使用现有段落中写得不佳的链接文本,并将其重写,使其具有良好的链接文本。
- 向任何需要添加警告的链接添加警告。
注意: 示例中的第一个和第三个链接都设置了 target="_blank"
属性,以便当您单击它们时,它们会在新标签页中打开链接的页面。这并非严格意义上的最佳做法,但我们在这里这样做是为了防止页面在嵌入的 <iframe>
中打开,从而避免您的示例代码丢失!
尝试更新下面的实时代码以重新创建完成的示例。
下载此任务的起点 以在您自己的编辑器或在线编辑器中进行操作。