如何在HTML中创建脚注链接？

Question

例如:

这是我内容的主体.我有一个脚注链接[1].然后,我有更多的内容.其中一些很有趣,它也有一些脚注[2].

[1]这是我的第一个脚注.

[2]另一个脚注.

因此,如果我点击"[1]"链接,它会将网页指向第一个脚注引用,依此类推.我究竟如何在HTML中完成此操作？

Answer 1

给容器一个id,然后使用#来引用该Id.

例如

<p>This is main body of my content. I have a footnote link for this line <a href="#footnote-1">[1]</a>. Then, I have some more content. Some of it is interesting and it has some footnotes as well <a href="#footnote-2">[2]</a>.</p>

<p id="footnote-1">[1] Here is my first footnote.</p>
<p id="footnote-2">[2] Another footnote.</p>

Answer 2

最好提供从脚注到引用位置的链接(假设有1:1的关系).这很有用,因为后退按钮会将用户带回到之前的滚动位置,让读者在文本中找到它们的位置.单击返回到文本中引用脚注的位置的链接会将该文本放在窗口的顶部,使读者可以轻松地从中断的位置进行拾取.

怪异模式有一个页面脚注在网络上(虽然它建议您使用图片的标题说明,而不是注脚我认为脚注都比较接近,并链接到脚注和脚注接着一个链接回我怀疑他们会更容易的文本跟随屏幕阅读器).

quirksmode页面中的一个链接建议在脚注链接后的文本后面有一个箭头↩,并使用实体↩ 为了这.

例如:

This is main body of my content.
I have a footnote link for this line
<a id="footnote-1-ref" href="#footnote-1">[1]</a>.
Then, I have some more content.
Some of it is interesting and it has some footnotes as well
<a id="footnote-2-ref" href="#footnote-2">[2]</a>.

<p id="footnote-1">
   1. Here is my first footnote. <a href="#footnote-1-ref">&#8617;</a> 
</p>
<p id="footnote-2">
   2. Another footnote. <a href="#footnote-2-ref">&#8617;</a>
</p>

我不确定屏幕阅读器如何处理该实体.与Grubber的帖子的评论相关联的是鲍勃东方关于脚注可访问性的帖子,这表明它没有被阅读,虽然这是几年前的事情,我希望屏幕阅读器现在已经有所改进.对于可访问性,可能值得使用文本锚点,例如"返回文本"或者可能将其放在链接的title属性中.虽然我不知道屏幕阅读器如何处理它,但也可能值得在原始脚注上加一个.

This is main body of my content.
I have a footnote link for this line
<a id="footnote-1-ref" href="#footnote-1" title="link to footnote">[1]</a>.
Then, I have some more content.
Some of it is interesting and it has some footnotes as well
<a id="footnote-2-ref" href="#footnote-2" title="link to footnote">[2]</a>.

<p id="footnote-1">
   1. Here is my first footnote.
      <a href="#footnote-1-ref" title="return to text">&#8617;</a> 
</p>
<p id="footnote-2">
   2. Another footnote.
      <a href="#footnote-2-ref" title="return to text">&#8617;</a>
</p>

(我只是猜测这里的可访问性问题,但由于我没有提到我提到的任何文章,我认为值得提出.如果有人能在这个问题上发表更多权威,我会对此感兴趣听.)