第1关：HTML链接：带超链接的网页

最新推荐文章于 2023-04-02 15:24:56 发布

卜凡.

最新推荐文章于 2023-04-02 15:24:56 发布

阅读量5.1k

点赞数 4

分类专栏： Educoder刷题文章标签： html visual studio code

原文链接：https://blog.csdn.net/m0_37908260/article/details/117393351

版权

Educoder刷题专栏收录该内容

15 篇文章 32 订阅

订阅专栏

本教程介绍了如何在HTML中创建内部导航链接、外部链接以及邮件和返回顶部的链接。学习了如何使用``标签，包括设置`href`属性、`target`属性以及锚点链接，以实现页面内的跳转和新窗口打开链接。

摘要由CSDN通过智能技术生成

任务描述

本关的任务是编写一个带超链接的HTML页面，链接包含页面内导航链接和跳转其他网页的链接。显示效果如下：

在这里插入图片描述

编程要求

请在右侧的编辑器中的Begin - End区域内直接编辑修改HTML页面，具体要求是：

补全第17行href属性值和第27行id属性值，使得点击第1关和第2关之后，可以导航到相应内容位置；
为第22、23和24行的的三个<a>标签添加target属性，使得链接在新标签中打开；
完善第32行<a>标签，使得邮箱链接起作用；
完善第33行<a>标签，使得点击回到顶部之后，可以导航到页面顶部。

测试说明

补充完代码后，点击测评，平台会对你编写的代码进行测试，当你的结果与预期输出一致时，即为通过；

把自己的生活当作正文，把书籍当作注解。

恭喜你完成本关，如果觉得有收获，就在下面点个赞吧！

源码

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>HTML链接</title>
    <meta name="description" content="HTML链接知识讲解">
    <meta name="keywords" content="HTML, Link">
</head>
  <!--------- Begin-------->

<body>
    <h1>HTML 入门</h1>
    <h2>本页目录</h2>
    <ul>
        <li><a href="#toc1">简介</a></li>
        <li><a href="#toc2">第1关</a></li>
        <li><a href="#toc3">第2关</a></li>
    </ul>

    <h2 id="toc1">简介</h2>
    <p>
        <a href="https://en.wikipedia.org/wiki/HTML" target="_blank">HTML</a>(Hypertext Markup Language，超文本标记语言)是一种用于创建Web页面和Web应用的标准化标记语言。在
        <a href="https://en.wikipedia.org/wiki/CSS" target="_blank">CSS</a>(Cascading Style Sheets，级联样式表单)和
        <a href="https://en.wikipedia.org/wiki/JavaScript" target="_blank">JavaScript</a>的帮助下，HTML已经成功构建了一整套面向Web的开发与应用平台。</p>
    <p>自1995年HTML2.0面世，HTML陆续推出了得到广泛应用的HTML3.2和HTML4.0标准，2014年HTML5标准的面世使其在多媒体和移动性方面得到了全面提升，使HTML迎来了新的爆发式发展。</p>
    
    <h2 id="toc2">第1关</h2>
    <p>初识HTML：简单的Hello World网页</p>
    <h2 id="toc3">第2关</h2>
    <p>HTML链接：带超链接的网页</p>
    <hr>
    <p>若需帮助，请发送问题到<a href="mailto:someone@email.com">E-Mail</a>。</p>
    <p><a href="#">回到顶部</a></p>
</body>
  <!--------- End-------->

</html>

卜凡.

关注

4
点赞
踩
22

收藏

觉得还不错? 一键收藏
0
评论
第1关：HTML链接：带超链接的网页

任务描述本关的任务是编写一个带超链接的HTML页面，链接包含页面内导航链接和跳转其他网页的链接。显示效果如下：编程要求请在右侧的编辑器中的Begin - End区域内直接编辑修改HTML页面，具体要求是：补全第17行href属性值和第27行id属性值，使得点击第1关和第2关之后，可以导航到相应内容位置；为第22、23和24行的的三个<a>标签添加target属性，使得链接在新标签中打开；完善第32行<a>标签，使得邮箱链接起作用；完善第33行<a>标签，
复制链接

扫一扫

专栏目录