Github Markdown 锚点仅链接到页面顶部

Github Markdown anchor only linking to top of the page

我不确定这个地方是否适合询问 Github 维基降价问题。如果是这样,我会删除它。

因此,我正在为存储库编写一个 wiki 页面,并且我一直在尝试添加锚点。但是,锚点似乎只导致重新加载页面,或者导致页面顶部。我很确定我的语法是正确的,但我不知道哪里出了问题。

我举个例子:

Link 如: <a name="#dinpanel"></a>

然后我通过以下方式访问它: [text to show](myrepositoryweburl#dinpanel) 此外,如果我只是在 URL 中键入 "myrepositoryweburl#dinpanel",它仍会加载到页面顶部。我想知道 Markdown 是怎么回事。如有任何帮助,我们将不胜感激!

使用 Markdown header 而不是原始 HTML 锚点。

github/markup 中所述,在 Markdown 转换为 HTML...

The HTML is sanitized, aggressively removing things that could harm you and your kin—such as script tags, inline-styles, and class or id attributes.

虽然没有特别提到 name 属性,但是 id 属性是并且它们具有相似的功能。 previous version of the document linked to the sanitation script,它不包括批准属性白名单中的 name 属性。换句话说,GitHub 的消毒剂正在删除您的 name 属性。

事实上,如果您使用浏览器的 view source 功能,我希望您会发现该页面上的 HTML 中缺少 name 属性。然而,一切并没有丢失。如果您注意到,第 4 步包括(强调):

The HTML is passed through other filters in the html-pipeline that add special sauce, such as emoji, task lists, named anchors, CDN caching for images, and autolinking.

换句话说,文档中的每个 header(h1h2、... h6)都被分配了一个唯一的 id。因此,您可以指向分配给任何 header 的 id,您将获得您想要的行为。

# Din Panel

...

[link](#din-panel)

请注意,要生成 id,所有字符都将转换为小写 ASCII 字符,删除所有标点符号(连字符和空格除外),并将所有空格替换为连字符 (-) .最后,如果需要,在末尾附加一个递增的数字以确保每个 id 都是唯一的。

如果您无法正确猜测 auto-generated id,您可以随时在 GitHub 上查看生成的页面,当鼠标悬停在 header 上时,锚图标将出现在文本旁边。该图标将包含一个 link 到那个特定 header 和正确的 id。或者您可以使用浏览器的 view source 功能(或 inspect 开发人员工具)来确定分配给 header.

id

GitHub wiki 去除了您可能嵌入 HTML 中的所有 "id=" 标签。这意味着您的 intra-page link 将无法工作,除非您 link 使用由 GitHub wiki 自动生成的 ID。

例如,要在 GitHub wiki 中执行 foot-notes:

首先,为您的 wiki 页面的每个部分使用一个标题。该标题会自动生成一个 ID,您可以通过预览页面并将鼠标光标稍微悬停在标题左侧来查看 link。转换是可预测的:“A Heading Like This”变成相对 URL“#a-heading-like-this”。

从您的 wiki 文档中,link 到带有内联 HTML 的脚注,看起来像这样,每个脚注都有自己的编号,从 1 开始:

<sup><a href="#93">[93]</a></sup>

在您的 wiki 页面的末尾,按如下方式排列脚注,每个脚注指向脚注 link 所在的 header:

***

###### [1]
Here is the text of footnote number 1 [↩](#a-heading-like-this)

###### [2]
Here is the text of footnote number 2 [↩](#a-heading-like-this)

我使用 markdown 作为页面中的锚点。

Link 为:

<a id="idtext"></a>  

然后我访问它:

[text to show](#idtext)