您当前的位置:首页 > 网络教程 > HTML教程

8.2 锚点链接

HTML中的链接,正确的说法应该称作"锚点",它命名锚点链接(也叫书签链接)常常用于那些内容庞大繁琐的网页,通过点击命名锚点,不仅让我们能指向文档,还能指向页面里的特定段落,更能当作"精准链接"的便利工具,让链接对象接近焦点。便于浏览者查看网页内容。类似于我们阅读书籍时的目录页码或章回提示。在需要指定到页面的特定部分时,标记锚点是最佳的方法。

用法

1、创建命名锚点,给该标签一个id

2、链接到命名锚点,其href属性的值为#命名锚点的id值

举例

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="utf-8">
        <title>锚点链接</title>
    </head>
    <body>
        <ul>
            <li><a href="#lsy">查看李商隐的简介</a></li>
            <li><a href="#nlxd">查看纳兰性德的简介</a></li>
        </ul>

        <h2>辛弃疾</h2>
        <p>辛弃疾(1140-1207),南宋词人。原字坦夫,改字幼安,别号稼轩,汉族,历城(今山东济南)人。出生时,中原已为金兵所占。21岁参加抗金义军,不久归南宋。历任湖北、江西、湖南、福建、浙东安抚使等职。</p>

        <h2>王维</h2>
        <p>王维(701年-761年,一说699年—761年),字摩诘,号摩诘居士。汉族,河东蒲州(今山西运城)人,祖籍山西祁县,唐朝诗人,有“诗佛”之称。苏轼评价其:“味摩诘之诗,诗中有画;观摩诘之画,画中有诗。”</p>

        <h2><a name="nlxd">纳兰性德</a></h2>
        <p>纳兰性德(1655-1685),满洲人,字容若,号楞伽山人,清代最著名词人之一。其诗词“纳兰词”在清代以至整个中国词坛上都享有很高的声誉,在中国文学史上也占有光彩夺目的一席。</p>

        <h2><a name="lsy">李商隐</a></h2>
        <p>李商隐(约813年-约858年),字义山,号玉溪(谿)生、樊南生,唐代著名诗人,祖籍河内(今河南省焦作市)沁阳,出生于郑州荥阳。他擅长诗歌写作,骈文文学价值也很高,是晚唐最出色的诗人之一,和杜牧合称“小李杜”</p>

        <h2>陆游</h2>
        <p>陆游(1125年11月13日-1210年1月26日),字务观,号放翁,汉族,越州山阴(今浙江绍兴)人,尚书右丞陆佃之孙,南宋文学家、史学家、爱国诗人。陆游生逢北宋灭亡之际</p>

        <h2>陶渊明</h2>
        <p>陶渊明(约365~427年),字元亮,晚年更名潜,字渊明。别号五柳先生,私谥靖节,世称靖节先生。浔阳柴桑(今江西九江)人。东晋末到刘宋初杰出的诗人、辞赋家、散文家。</p>
    </body>
</html>

运行浏览器后得到的效果如图

以上实例,类似一个书签目录,用户可以通过点击需要查看目录名,直接跳转到当前页面的目录内容下,这样查看非常的方便,用户体验也会很好。

附加说明:创建锚点链接在一个复杂并且页面比较多的文档中是非常有必要的。

 

你觉得文章内容怎么样

阿里云代金券 100 云产品通用

有效期30天 首购用户

立即领取
阿里云代金券 100 云产品通用

有效期30天 复购+升级

立即领取