课程表

Markdown课程

工具箱
速查手册

Markdown 链接

当前位置:免费教程 » HTML/CSS » Markdown

Markdown 支持两种形式的链接语法: 行内式和参考式两种形式。

不管是哪一种,链接文字都是用 [方括号] 来标记。

要建立一个行内式的链接,只要在方块括号后面紧接着圆括号并插入网址链接即可,如果你还想要加上链接的 title 文字,只要在网址后面,用双引号把 title 文字包起来即可,例如:

  1. This is [an example](http://example.com/ "Title") inline link.
  2.  
  3. [This link](http://example.net/) has no title attribute.

会产生:

  1. <p>This is <a href="http://example.com/" title="Title">
  2. an example</a> inline link.</p>
  3.  
  4. <p><a href="http://example.net/">This link</a> has no
  5. title attribute.</p>

尝试一下

如果你是要链接到同样主机的资源,你可以使用相对路径:

  1. See my [About](/about/) page for details.

参考式的链接是在链接文字的括号后面再接上另一个方括号,而在第二个方括号里面要填入用以辨识链接的标记:

  1. This is [an example][id] reference-style link.

你也可以选择性地在两个方括号中间加上一个空格:

  1. This is [an example] [id] reference-style link.

接着,在文件的任意处,你可以把这个标记的链接内容定义出来:

  1. [id]: http://example.com/  "Optional Title Here"

尝试一下

链接内容定义的形式为:

  • 方括号(前面可以选择性地加上至多三个空格来缩进),里面输入链接文字

  • 接着一个冒号

  • 接着一个以上的空格或制表符

  • 接着链接的网址

  • 选择性地接着 title 内容,可以用单引号、双引号或是括弧包着

下面这三种链接的定义都是相同:

  1. [foo]: http://example.com/  "Optional Title Here"
  2. [foo]: http://example.com/  'Optional Title Here'
  3. [foo]: http://example.com/  (Optional Title Here)

请注意:有一个已知的问题是 Markdown.pl 1.0.1 会忽略单引号包起来的链接 title。

链接网址也可以用尖括号包起来:

  1. [id]: <http://example.com/>  "Optional Title Here"

你也可以把 title 属性放到下一行,也可以加一些缩进,若网址太长的话,这样会比较好看:

  1. [id]: http://example.com/longish/path/to/resource/here
  2.     "Optional Title Here"

网址定义只有在产生链接的时候用到,并不会直接出现在文件之中。

链接辨别标签可以有字母、数字、空白和标点符号,但是并不区分大小写,因此下面两个链接是一样的:

  1. [link text][a]
  2. [link text][A]

隐式链接标记功能让你可以省略指定链接标记,这种情形下,链接标记会视为等同于链接文字,要用隐式链接标记只要在链接文字后面加上一个空的方括号,如果你要让 "Google" 链接到 google.com,你可以简化成:

  1. [Baidu][]

然后定义链接内容:

  1. [Baidu]: http://www.baidu.com/

由于链接文字可能包含空白,所以这种简化型的标记内也许包含多个单词:

  1. Visit [Daring Fireball][] for more information.

然后接着定义链接:

  1. [Daring Fireball]: http://daringfireball.net/

尝试一下

链接的定义可以放在文件中的任何一个地方,我比较偏好直接放在链接出现段落的后面,你也可以把它放在文件最后面,就像是注解一样。

下面是一个参考式链接的范例:

  1. get 10 times more traffic from [Google] [1] than from
  2. [Yahoo] [2] or [MSN] [3].
  3.  
  4.   [1]: http://google.com/        "Google"
  5.   [2]: http://search.yahoo.com/  "Yahoo Search"
  6.   [3]: http://search.msn.com/    "MSN Search"

如果改成用链接名称的方式写:

  1. get 10 times more traffic from [Google][] than from
  2. [Yahoo][] or [MSN][].
  3.  
  4.   [google]: http://google.com/        "Google"
  5.   [yahoo]:  http://search.yahoo.com/  "Yahoo Search"
  6.   [msn]:    http://search.msn.com/    "MSN Search"

上面两种写法都会产生下面的 HTML。

  1. <p>I get 10 times more traffic from <a href="http://google.com/"
  2. title="Google">Google</a> than from
  3. <a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a>
  4. or <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p>

下面是用行内式写的同样一段内容的 Markdown 文件,提供作为比较之用:

  1. get 10 times more traffic from [Google](http://google.com/ "Google")
  2. than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
  3. [MSN](http://search.msn.com/ "MSN Search").

尝试一下

参考式的链接其实重点不在于它比较好写,而是它比较好读,比较一下上面的范例,使用参考式的文章本身只有 81 个字符,但是用行内形式的却会增加到 176 个字元,如果是用纯 HTML 格式来写,会有 234 个字元,在 HTML 格式中,标签比文本还要多。

使用 Markdown 的参考式链接,可以让文件更像是浏览器最后产生的结果,让你可以把一些标记相关的元数据移到段落文字之外,你就可以增加链接而不让文章的阅读感觉被打断。

转载本站内容时,请务必注明来自W3xue,违者必究。
 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号