pookie... pookie... pookie... pookie...

Markdown中的交叉引用(命名锚)

html HTML

乐小小猪猪

2020-03-19

是否有markdown语法等效于:

Take me to <a href="#pookie">pookie</a>

... 

<a name="pookie">this is pookie</a>

第2356篇《Markdown中的交叉引用(命名锚)》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

7个回答
小胖十三 2020.03.19

适用于大多数常见的降价生成器。您在每个标头中都有一个简单的自行生成的锚。例如,使用pandoc时,生成的锚点将是标题的烤肉串。

 echo "# Hello, world\!" | pandoc
 # => <h1 id="hello-world">Hello, world!</h1>

根据您使用的降价解析器,锚点可能会发生变化(以symbolrush和La muerte Peluda的答案为例,它们是不同的!)。请参阅此babelmark,在可以根据markdown的实现查看生成的锚

LEvaGreen 2020.03.19

最初的Markdown语法中没有现成的语法可以执行此操作,但是Markdown Extra提供了一种至少将ID分配给标头的方法,然后您可以轻松地链接到标头。还请注意,您可以在Markdown和Markdown Extra中使用常规HTML,并且该name属性已被id更新版本的HTML 中的属性所取代

村村Gil 2020.03.19

Markdown Anchor支持井号,因此指向页面中锚点的链接就是[Pookie](#pookie)

Gruber Markdown实际上并不支持生成锚,但是在其他实现中(例如Markdown Extra)则支持生成锚

在Markdown Extra中,锚ID通过附加到标头或子标头{#pookie}

Git存储库页面中的Github Flavored Markdown(而不是Gists中的)在所有标头(h1,h2,h3等)上自动生成带有多个标记标签的,包括:

  • id="user-content-HEADERTEXT"
  • class="anchor"
  • href="#HEADERTEXT"
  • aria-hidden="true" (这是在鼠标悬停时显示的svg链接图标)

写道:不包括aria / svg图标:

  • # Header Title

Github生成:

  • <h1><a id="user-content-header-title" class="anchor" href="#header-title">Header Title</a></h1>

因此,无需执行任何操作即可创建标题链接,并且始终可以使用以下方法链接到它们:

  • 链接到 [Header Title](#header-title)
老丝猪猪小卤蛋 2020.03.19

对于正在GitBook中寻求此问题解决方案的任何人。这就是我使其工作的方式(在GitBook中)。您需要显式标记标头,如下所示:

# My Anchored Heading {#my-anchor}

然后像这样链接到该锚点

[link to my anchored heading](#my-anchor)

解决方案和其他示例可以在这里找到:https : //seadude.gitbooks.io/learn-gitbook/

JimStafan 2020.03.19

晚会晚了,但我认为此添加可能对与之合作的人有用rmarkdownrmarkdown有内置在你的文档中引用头支持。

定义的任何标头

# Header

可以被引用

get me back to that [header](#header)

以下是.rmd显示此行为的最小独立文件。可以编织到.pdf.html

---
title: "references in rmarkdown"
output:
  html_document: default
  pdf_document: default
---

# Header

Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. Write some more text. 

Go back to that [header](#header).
路易伽罗 2020.03.19

在bitbucket.org上,投票解决方案无效。相反,当使用标头(与##一起使用)时,可以通过将标头作为#markdown-header-my-header-name前缀来引用它们作为锚点,其中#markdown-header-是渲染器生成的隐式前缀,并且其余的是小写的标题,用短划线代替空格。

## My paragraph title

会产生一个像这样的隐式锚

#markdown-header-my-paragraph-title

每个锚点引用之前的整个URL是可选的,即

[Some text](#markdown-header-my-paragraph-title)

等价于

[Some text](https://bitbucket.org/some_project/some_page#markdown-header-my-paragraph-title) 

前提是它们在同一页面中。

来源:https : //bitbucket.org/tutorials/markdowndemo/overview(编辑此.md文件的来源并查看锚的制作方式)。

十三GreenTony 2020.03.19

使用nameid在HTML 5中不需要使用,而是会在JavaScript中创建全局变量

请参阅HTML 5规范5.9.8导航至片段标识符 - idname都使用。

重要的是要知道大多数浏览器仍会将ID转换为全局变量这是一个快速测试使用a name避免创建全局变量以及可能导致的任何冲突。

使用名称的示例:

Take me to [pookie](#pookie)

和目标锚点:

### <a name="pookie"></a>Some heading

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android