html锚点

最新推荐文章于 2024-07-26 14:14:21 发布

xy8199

最新推荐文章于 2024-07-26 14:14:21 发布

阅读量203

点赞数

分类专栏： JavaScript 文章标签： html url

本文链接：https://blog.csdn.net/xy8199/article/details/78252871

版权

JavaScript 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

锚点是网页制作中超级链接的一种，又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接，运用相当普遍。

英文名：anchor

使用命名锚记可以在文档中设置标记，这些标记通常放在文档的特定主题处或顶部。然后可以创建到这些命名锚记的链接，这些链接可快速将访问者带到指定位置。

创建到命名锚记的链接的过程分为两步。首先，创建命名锚记，然后创建到该命名锚记的链接。

例图：

源码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>锚点</title>
    <style type="text/css">
        li {
            list-style: none;
            float: left;
            margin: 8px;
        }
    </style>
</head>
<body>
<ul>
    <li><a href="#index">首页</a></li>
    <li><a href="#news">新闻</a></li>
    <li><a href="#sport">体育 </a></li>
    <li><a href="#game">游戏</a></li>
</ul>

<div style="clear: both"></div>

<div>
    <a id="index"></a>

    <h2>首页</h2>
    <hr>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
</div>

<div>
    <a id="news"></a>

    <h2>新闻页面</h2>
    <hr>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
</div>

<div>
    <a id="sport"></a>

    <h2>体育页面</h2>
    <hr>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
</div>

<div>
    <a id="game"></a>

    <h2>游戏页面</h2>
    <hr>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
    <br><br><br><br><br><br>
</div>
</body>
</html>