如何链接到页面的一部分？(哈希？)

Question

如何链接(与<a>),以便浏览器转到目标页面上的某个子标题而不是顶部？

Answer 1

如果有<a name="foo">标签或任何带有id(例如<div id="foo">)的标签,则只需附加#foo到URL即可.否则,您不能随意链接到页面的某些部分.

这是一个完整的例子: <a href="http://example.com/page.html#foo">Jump to #foo on page.html</a>

链接同一页面上的内容示例: <a href="#foo">Jump to #foo on same page</a>

Answer 2

您使用锚点和哈希.例如:

链接的目标:

 <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>

Answer 3

只需将带有元素ID的哈希附加到URL即可.例如

<div id="about"></div>

和

http://mysite.com/#about

所以链接看起来像:

<a href="http://mysite.com/#about">About</a>

要不就

<a href="#about">About</a>

Answer 4

2020 年 3 月 12 日，WICG 为文本片段添加了一个草稿，现在您可以通过将以下内容添加到哈希中来链接到页面上的文本，就像您在搜索它一样

#:~:text=<Text To Link to>

工作示例Chrome Version 81.0.4044.138：

单击此链接应重新加载页面并突出显示链接的文本

Answer 5

方法如下:

<a href="#go_middle">Go Middle</a>

<div id="go_middle">Hello There</div>

Answer 6

您有两种选择:

您可以在文档中放置锚点,如下所示:

<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>