你如何链接(与<a>),使浏览器去到目标页面上的特定子标题,而不是顶部?
当前回答
以下是如何做到的:
<a href="#go_middle">Go Middle</a>
<div id="go_middle">Hello There</div>
其他回答
以下是如何做到的:
<a href="#go_middle">Go Middle</a>
<div id="go_middle">Hello There</div>
2020年3月12日,WICG为文本片段添加了一个草案,现在你可以链接到页面上的文本,就像你在搜索它一样,将以下内容添加到散列中
#:~:text=<链接到>的文本
Chrome Version 81.0.4044.138运行示例:
点击此链接应重新加载页面并突出显示链接的文本
如果有任何带有id的标签(例如,<div id="foo">),那么你可以简单地将#foo附加到URL。否则,您不能任意链接到页面的各个部分。
下面是一个完整的例子:<a href="http://example.com/page.html#foo">跳转到page.html上的#foo </a> .html
<a href="#foo">跳转到同一页面上的#foo </a>
它被称为URI片段。
你有两个选择:
你可以在你的文档中放置一个锚,如下所示:
<a name="ref"></a>
或者给任意HTML元素一个id:
<h1 id="ref">Heading</h1>
然后只需将散列#ref附加到链接的URL,以跳转到所需的引用。例子:
<a href="document.html#ref">Jump to ref in document.html</a>
使用锚和散列。例如:
链接目标:
<a name="name_of_target">Content</a>
链接到目标:
<a href="#name_of_target">Link Text</a>
或者,如果从不同的页面链接:
<a href="http://path/to/page/#name_of_target">Link Text</a>