【前端】【案例】之HTML中点击超链接跳转到其他页面指定锚点的简易设置 —— 代码实操

Oct.S

已于 2023-01-20 15:41:55 修改

阅读量4k

点赞数 3

分类专栏：案例文章标签：前端 html

于 2022-11-14 20:46:30 首次发布

本文链接：https://blog.csdn.net/HY_Sophie/article/details/127854982

版权

案例专栏收录该内容

11 篇文章 0 订阅

订阅专栏

准备：在同一个文件夹下创建两个html文件，文件一命名，index1.html，文件二命名，index2.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>锚点的设置</title>
    </head>
    <body>
        <div id="in1">
            <a href="index2.html#in2">跳转</a>
        </div>
    </body>
</html>

在index1.html中复制以上代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>跳转链接</title>
    </head>
    <body>
        <div id="in2">
            <a href="index1.html#in1">返回</a>
        </div>
    </body>
</html>

在index2.html中复制以上代码

结果：用浏览器打开index1.html，点击跳转后跳转到index2.html，在index2.html中点击返回会跳转到index1.html，也就是返回到原来的index1.html，若html文件不在同一级目录，则根据浅谈个人对于相对路径与绝对路径在前端开发中的应用与理解_HY_Sophie的博客-CSDN博客

中的相对地址对href部分进行更改。