Markdown 是什么?

关注者
932
被浏览
450,035

36 个回答

直接贴上来了:

Markdown 使用说明

Markdown 介绍

在教程正式开始之前,请先打开

Markdown 测试工具

,这里面的所有示例都可以直接在该测试工具中测试,或者你也可以将 Markdown 的脚本下载至自己的电脑测试。Markdown 是这样两种东西,首先,他是一个格式化语法结构,其次他是一个使用Perl语言编写的用来实现Markdown至HTML转换的工具,它的设计目标就是让写作者尽可能使用容易阅读的语法书写,而不必被繁琐的HTML标签结构所纠缠,就像下面这样就可以创建一个一级标题的HTML结构:

# Markdown 介绍 #

Markdown 基本语法详解

使用 Markdown 一般情况下是没有可视化编辑界面的(Markdown与HTML的不同点在于它的设计初忠就是要写作者使用转Markdown代码(这里称之为代码吧,其实不是,它就是纯文本)),有一些网站在使用的时候,写作界面分为两个区域,预览区域和编辑区域,编辑区域就是写 Markdown,预览区会动态的将编辑区的修改即时的转换为HTML后展示出来以达到可视化编辑 的效果,但是我们这里所讲的,仅仅只是Markdown的语法。

段落、标题以及块引用

要使用 Markdown创建段落应该是最简单的了,只需要某一段文字顶头书写然后前后空行即可,这里不再做过多说明。

标题的创建也十分简单,这里有两种方法,最常用的就是在要作为标题的文字下一行(不空行)添加超一个的= 号或者 - 号,例如:

这是一个一级标题
==============

这是一个二级标题
---------------------------

将被转换成为:

<h1>这是一个一级标题</h1>

<h2>这是一个二级标题</h2>

另外一种创建标题的方法能创建出所有六级标题,它们分别是在要创建标题的那一行方案最前面顶行创建一个或者多个 # 号,并以相同数量的 # 结尾,比如:

### 这是三级标题 ###

##### 这是五级标题

将被转换成为:

<h3>这是三级标题</h3>

<h5>这是五级标题</h5>

你可以看到,后面结尾的 # 是可以省略的。

块级引用的创建是在需要作为块引用的所有文本行前面加上 > 符号,比如:

> 这是块引用的第一行,将会成为块引用中的一个段落
> 
> 这是块引用的第二段
> ## 这是块引用中的一个二级标题

转被转换成为下面这样的HTML代码:

<blockquote>
<p>这是块引用的第一行,将会成为块引用中的一个段落</p>

<p>这是块引用的第二段</p>

<h2>这是块引用中的一个二级标题</h2>
</blockquote>

加强与强调

Markdown 使用 星号(*)下划线(_) 表示加强与强调,如下所示:

胡潇说:”我 *不想* 和鸟蛋睡一起!“
刘钊说:“我 _更不想_ 和潇老娘子睡一起!”

然后潘韬就说了:“你们两个都 **不要睡了** 吧!”
潘韬还说了:“ __都跟__ 哥睡!”

将被转换成为:

<p>胡潇说:”我 <em>不想</em> 和鸟蛋睡一起!“
刘钊说:“我 <em>更不想</em> 和潇老娘子睡一起!”</p>

<p>然后潘韬就说了:“你们两个都 <strong>不要睡了</strong> 吧!”
潘韬还说了:“ <strong>都跟</strong> 哥睡!”</p>

列表

无序列表可以使用星号,加号或者减号(*、+、-)创建,它们三者效果都是一样的,比如下的示例:

* 第一项
* 第二项
* 第三项

+ 第一项
+ 第二项
+ 第三项

还有

- 第一项
- 第二项
- 第三项

都会被转换成为:

<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</li>

有序列表则直接在每一项前面加上阿拉伯数字与小数点即可,如下:

1. 有序列表第一项
2. 有序列表第二项
3. 有序列表第三项

将被转换成为:

<ol>
<li>有序列表第一项</li>
<li>有序列表第二项</li>
<li>有序列表第三项</li>
</ol>

如果您在每一个列表项之间添加了一个空行,那么主会在每一个列表项中创建一个段落,比如:

* 这是一个列表项

  这是第一列表项中的第二个段落

* 这是列表的另一个项目

将被转换成为:

<ul>
<li><p>这是一个列表项</p>
<p>这是第一列表项中的第二个段落</p></li>
<li><p>这是列表的另一个项目</p></li>
</ul>

链接

Markdown使用两种方法创建链接,行内创建与引用创建,行内创建一般使用得比较多,它的创建语法是下面这样的:

这是一个示例[链接](http://aitine.com)。

转换成为:

<p>这是一个示例<a href="http://aitine.com">链接</a>。</p>

如果要为链接指定 title 属性,刚可以使用下面这样的:

这是一个示例[链接](http://aitine.com "这是一个标题")。

而以引用的方式创建链接一般用在学术论文上面比较多,或者另一种情况,如果某一个链接在文章中多处使用,那么使用引用 的方式创建链接将非常好,它可以让你对链接进行统一的管理,这有点类似于 LaTeX 对文档引用的管理,创建方法如下:

我最喜欢的几个网站是[Google][1] 、[艾天科技][2] 以及 [自己的博客][3],但是最喜欢的却是 [艾天项目管理平台][atoa],因为 [谷歌][1] 老是不能被访问到。

[1]:http://www.google.com "Google"
[2]:http://aitine.com "Aitine Technology"
[3]:http://note.costony.com "Notes of Cos Tony"
[atoa]:http://us.aitine.com "艾天项目管理平台"

转换后得到:

<p>我最喜欢的几个网站是<a href="http://www.google.com" title="Google">Google</a> 、<a href="http://aitine.com" title="Aitine Technology">艾天科技</a> 以及 <a href="http://note.costony.com" title="Notes of Cos Tony">自己的博客</a>,但是最喜欢的却是 <a href="http://us.aitine.com" title="艾天项目管理平台">艾天项目管理平台</a>,因为 <a href="http://www.google.com" title="Google">谷歌</a> 老是不能被访问到。</p>

从Markdown链接的引用创建方法中,你应该了解到一些基本的引用管理知识,要知道,专业的印刷行业里面、学术论文写作里面一般都不是使用 Word 或者什么可视化编辑工具来书写的,因为这些工具的引用管理功能都太弱了,而且使用起来十分的麻烦,一般都是使用

Tex

或者

LaTex

,有兴趣的可以去了解一下。

图片

图片的语法与链接的十分相似,行内创建时:

![Alt 文本](/path/to/img.jpg "图片 Title")

转换成为:

<p><img src="/path/to/img.jpg" alt="Alt 文本" title="图片 Title" /></p>

引用式创建也很相似:

![Alt 文本][id]

[id]:/path/to/img.jpg "标题"

转换结果是:

<p><img src="/path/to/img.jpg" alt="Alt 文本" title="标题" /></p>

可以看到图片与链接的引用方式创建时,引用格式是一样的,所以,一个引用可以同时被图片和链接所使用。

添加代码段

添加代码段应该是最简单的了,只需要把你想发布的任何代码不要顶头写就行,一般在前面留四个空格,比如:

我们的代码如下:

    <p>这是HTML代码</p>

转换后得到:

<p>我们的代码如下:</p>

<pre><code>&lt;p&gt;这是HTML代码&lt;/p&gt;
</code></pre>

所有以如特殊符号都会被自动转义。

Markdown 语法进阶在 Markdown 中嵌入原生HTML代码

在 Markdown 代码中嵌入 HTML代码,如果你想直接在 Markdown 中嵌入HTML代码,那么你只需要将代码直接写在需要的地方即可:

这是一个段落。

<table>
    <tr>
        <td>这是用原生的HTML代码写的表格。</td>
    </tr>
</table>

这是另一个段落。

转换之后得到:

<p>这是一个段落。</p>

<table>
    <tr>
        <td>这是用原生的HTML代码写的表格。</td>
    </tr>
</table>

<p>这是另一个段落。</p>

你还需要注意的一点是,Markdown 是不处理HTML的块级元素中的内容的,比如你可以直接在 <p> 标签中使用 * 号:

<p>这是一个 *段落*</p>

在转换之后还是:

<p>这是一个 *段落*</p>

相反的,HTML的行内标签却可以在 Markdown 的语法的任何地方使用(除了代码段中):

这是一个文本段,<span>这个被span标签</span> 包裹了。

转换后得到:

<p>这是一个文本段,<span>这个被span标签</span> 包裹了。</p>

行内元素包括 span、cite、del 等。

自动转义特殊字符

在HTML中,有两个字符是十分特殊的,他们是 < 和 & 符号,< 表示一个HTML标签的开始,&表示HTML特殊字符转义符的开始,在 Markdown 中这两个字符将会自动被转义,就如你刚才所看到的这一段话:

在HTML中,有两个字符是十分特殊的,他们是 < 和 & 符号,< 表示一个HTML标签的开始,&表示HTML特殊字符转义符的开始,在 Markdown 中这两个字符将会自动被转义,就如你刚才所看到的这一段话:

Markdown 转换之后得到的将是:

<p>在HTML中,有两个字符是十分特殊的,他们是 &lt; 和 &amp; 符号,&lt; 表示一个HTML标签的开始,&amp;表示HTML特殊字符转义符的开始,在 Markdown 中这两个字符将会自动被转义,就如你刚才所看到的这一段话:</p>

注意出现特殊符号的那几个位置。现在如果你想将一段文本指定到下面的这个URL中:

http://aitine.com/aitine?category=1&tag=3

Markdown 自动将您转换成为:

http://aitine.com/aitine?category=1&amp;tag=3

但是并不任何时候出现这些特殊自符的时候 Markdown 都会转义它们,比如前面说的,如果你写的就是完整的HTML代码,那么 Markdown 会不去管它,同样的,如果你写的是完整的HTML转义符,Markdown 也不会去管它,比如:

&copy;

Markdown 将不会去处理它,但是如果是:

AT&T

则会被转义成为:

AT&amp;T

块级元素段落与分行

一个段落就是前面都有空行的一行或者多行文本(空行的意思是说你看上去像空行的东西,比如一行内没有任何内容或者一个或者多个空格或者制表符都属于空行),任何段落都不能以空格或者制表符开始。

在 Markdown 中,所谓的一行或者多行是指:没有空行分隔的任意行文本,这个和许多其它 文本至HTML转换工具不同,Markdown 使用的是 硬包裹,它不会像其它转换工具那样转换成为 <br /> 标签。

如果你是真的想在一个段落中插入一个 <br /> 标签,那么只需要在你想插入的地方输入两个或者两个以上的空格,然后回车,Markdown 就会在这里强制为你换行。

块级元素是可以嵌套的,比如一个 li 里面可能会嵌套的块引用,这时,块引用所使用的 > 符号应该再缩进了,比如下面这样的:

* 这是第一条引用项目

    > 这是第一条引用的内容

* 这是第二个项目

最终会被转义成为:

<ul>
<li><p>这是第一条引用项目</p>
<blockquote>
<p>这是第一条引用的内容</p>
</blockquote></li>
<li><p>这是第二个项目</p></li>
</ul>

在这里我们还需要注意另外一个问题,根据Markdown 对有序列表的定义,所有以数字后面跟着点开头的一行,都将成为一个有序列表,比如:

1234. 这其实并不是一个有序列表项目

也会被转换成为:

<ol>
<li>这其实并不是一个有序列表项目</li>
</ol>

如果有哪里必须这样的形式开头,你可以使用 \ 这个符号来明确的告诉 Markdown 这里是不需要转换的:

1234\. 这其实并不是一个有序列表项目

将被转换成为:

<p>1234. 这其实并不是一个有序列表项目</p>

代码块

对于程序员写作,经常需要在文章中嵌入代码段,在Markdown中,要嵌入代码段,只需要将每一行代码前都至少添加四个空格或者一个制表符(如果你想保证代码展示的方式和你想要的展示样式一样,那么最好每一行代码缩进的间距都是一行,我推荐都使用四个空格),Markdown 会将这样的文本都当作需要展示的文本内容(而不是可执行的代码),如果有需要转义的,比如 < 等都会被转义成为转义符,而整个代码段都会被 <pre> 以及 <code> 标签包裹。

这是一个普通的文本段落。

    <code>但是这一行却会被当作是程序代码</code>

上面的文字转换之后得到:

<p>这是一个普通的文本段落。</p>

<pre><code>&lt;code&gt;但是这一行却会被当作是程序代码&lt;/code&gt;
</code></pre>

如果要在行

分割线

你可以使用下面这种方法在内容中插入分割线 <br /> : * * *

***

*************

- - -

---------------------

上面的任何一行都可以被转换成为:

<hr />

规则就是使用星号或者减号,排成一排,并且数量超过三个,任何两相相邻的符号之间的距离不能超一个空格

PHP Markdown Extra 介绍 (仅限 PHP Markdown Extra 版本)

上面我们已经完整的学习了 Markdown 官方 Perl 版本的基本使用方法,但是 Markdown 不止Perl一种语言的实现,在任何时候都应该尽可能的先考虑 Markdown 的基本实现,如果基本实现不支持的功能时,再考虑其它的实现,而本站所使用的Markdown为PHP的扩展实现,它在官方版本上,还增加了许多实用的功能,下面对其进行详细的介绍:

HTML 块级元素中的 Markdown 语法

在上面的介绍中我们已经说过,Markdown 是不对HTML块级元素中的内容作任何处理的,所以,你写进一个 <div> 标签中的任何内容都不可能享受到 Markdown 带来的方便,但是在 PHP Markdown Extra(以下简称PME)中,你却可以通过一种方式实现,即在其内容也需要提供 Markdown支持的块级元素标签中加入:markdown="1" 这个属性和值:

<div markdown="1">
这是一段由 *PHP Markdown Extra* 转换的内容
</div>

将成转换成为:

<p>这是一段由 <em>PHP Markdown Extra</em> 转换的内容</p>

标题元素的ID属性

在PME中,你可以对标题设定ID属性,只需要在标题行在后面加下给大括号包裹的CSS ID选择符即可,比如:

这是文章最上面的标题        {#article-header}
==================

## 这是某一个段落的标题 ##    {#some-part}

输出为:

<h1 id="article-header">这是文章最上面的标题</h1>

<h2 id="some-part">这是某一个段落的标题</h2>

然后,创建了带ID属性的标题之后,我们就可在文章的任何地方使用链接指向该标题了:

<p><a href="#some-part">某段的标题</a></p>

强制代码块

在原生的 Markdown 中,代码块必须以每一行增加统一的缩进(一般为四个或者一个制表符)来表示,但是在PME,还提供了一种强制代码段的实现方式,即在任何要作为代码段的文本前后分别加上三个或者超过三个的“~” 字符即可,但必须保证前后符号数量是一样的,使用这种方法创建代码段,代码不再需要缩进:

这是一个普通的段落

~~~~~~~~
这个是一行代码
~~~~~~~~

输出为:

<p>这是一个普通的段落</p>

<pre><code>这个是一行代码
</code></pre>

在下面学习定义列表时,你还可以发现,在定义列表的结尾,必须使用这种方式来创建代码段。

表格

PME 有自己专有的语法来创建简单的表格,“简单”的表格如下:

姓名|性别|年龄
-|-|-
潘韬|非女|24
刘钊|鸟蛋|2x
胡潇|娘子|2x

第一行将创建表格的头部,第二行分隔表格的头部与主体部分,从第三行开始,每一行为一个表格行,列与列之间都是通过“|”字符分隔,上面的字符输出的的表格如下:

<table>
<thead>
<tr>
  <th>姓名</th>
  <th>性别</th>
  <th>年龄</th>
</tr>
</thead>

<tbody><tr>
  <td>潘韬</td>
  <td>非女</td>
  <td>24</td>
</tr>
<tr>
  <td>刘钊</td>
  <td>鸟蛋</td>
  <td>2x</td>
</tr>
<tr>
  <td>胡潇</td>
  <td>娘子</td>
  <td>2x</td>
</tr>
</tbody></table>

需要注意的是,表格要求一行中至少有一个 “|” 字符,这使得如果你想创建一个只有一列的表格,那么必须至少在每一行的前面或者后面或者两头都加上 | 。

PME 还支持为表格中不同的列指定不同的文本对齐方向,默认的都是向左对齐,如果某一列需要向右对于,只需要在其头部与主体分隔行中,那一列的最后面加上冒号“:” 即可,如下示例:

产品 | 价格
--- | ---:
.com域名 | 120元/年
10G VPS | 500元/年
网站建设 | 根据不同的网站需求报价

输出的代码如下:

<table>
<thead>
<tr>
  <th>产品</th>
  <th align="right">价格</th>
</tr>
</thead>

<tbody><tr>
  <td>.com域名</td>
  <td align="right">120元/年</td>
</tr>
<tr>
  <td>10G VPS</td>
  <td align="right">500元/年</td>
</tr>
<tr>
  <td>网站建设</td>
  <td align="right">根据不同的网站需求报价</td>
</tr>

</tbody></table>

在表格中,你同样还可以使用任何行内语法,如下:

| 函数名称 | 说明                    |
| ------------- | ------------------------------ |
| `help()`      | 展示帮助窗口       |
| `destroy()`   | **摧毁你的电脑**     |

定义列表

PME 对定义列表也提供了支持,定义方式如下:

潘韬
:    有点儿像疯子的神经病

刘钊
:    有点儿像神经病的疯子

胡潇
:    是啥?

输出为:

<dl>
<dt>潘韬</dt>
<dd>有点儿像疯子的神经病</dd>

<dt>刘钊</dt>
<dd>有点儿像神经病的疯子</dd>

<dt>胡潇</dt>
<dd>是啥?</dd>
</dl>

定义列表允许你在定义描述时使用多行,第二行开始不再需要缩进,如下所示的定义描述中,后面两行的效果是一样的:

定义标题
:    定义的第一行
     这是第二行
这是第三行

如果在定义描述中需要分段,则只需要在段与段之间增加一个空行,并且保证第二段的第一行与定义描述的第一行使用同样的缩进即可:

定义标题
:    定义的第一行
     这是第二行
这是第三行

     这是第二段
     这是第二段二行
这是第二段第三行

如果一个定义有多个定义描述,那么只需要使用多个“:” 即可:

定义标题
:    定义的第一个描述
:    这是第二个描述

:     这是第三个描述

输出为:

<dl>
<dt>定义标题</dt>
<dd>定义的第一个描述</dd>

<dd>这是第二个描述</dd>

<dd>
<p>这是第三个描述</p>
</dd>
</dl>

从上面的示例中我们可以看到,如果在一个定义标题创建多个定义描述时,如果某一个定义描述前增加一个空行,则这个定义描述中会创建一个段落,否则将直接将内容包裹在 <dd> 标签中。在定义描述中,我们同样还可以添加代码段,列表,或者块级引用等内容,如下示例:

定义标题
:    这是一个定义描述

          <?php print("Hello PME"); ?>

     > 块引用
     > > 块引用中的引用

     1. 有序列表
     2. 第二项

输出结果为:

<dl>
<dt>定义标题</dt>
<dd>
<p>这是一个定义描述</p>

<pre><code>  &lt;?php print("Hello PME"); ?&gt;
</code></pre>

<blockquote>
  <p>块引用</p>

  <blockquote>
    <p>块引用中的引用</p>
  </blockquote>
</blockquote>

<ol>
<li>有序列表</li>
<li>第二项</li>
</ol>
</dd>
</dl>

脚注

脚注的工作原理与引用方式的链接十分的像,一个脚注由两个元素构成:一个对脚注的引用将会在转换的过程中转义为一个上标元素,并且链接至脚注的定义;一个脚注的将会和其它脚本等放在文档的最末位(位置非必需),如下示例:

生前何必贪睡?死后自会长眠![^1]

[^1]:引用自潘韬撰写的《睡眠经》第一章第一节

输出为:

<p>生前何必贪睡?死后自会长眠!<sup id="1"><a href="#fn:1" rel="footnote">1</a></sup></p>

<div class="footnotes">

<ol>

<li id="1">
<p>引用自潘韬撰写的《睡眠经》第一章第一节&nbsp;<a href="#fnref:1" rev="footnote">↩</a></p>
</li>

</ol>
</div>

想知道 Markdown 是什么,需要先搞清楚一个概念:富文本编辑器。

一般来说,在富文本编辑器输入一段文本,选择具体的格式后,能够直接显示对应的结果。例如我们常见的 Office Word 就是典型的富文本编辑器。

这样做有两个优势:

  1. 简单、直观;
  2. 所见即所得。


但这种方式带来一个难以弥补的缺陷:效率低下。

回想一下,我们在使用 Word 进行内容输出时,往往需要一边「输入文字」,一边用鼠标选择对应样式:加粗、排序、列表等。即便完成内容编辑,最后往往会出现「样式不一致」(大学论文排版时的痛苦)、「不同平台格式不统一」(例如 Word 和 WPS)等。


而 Markdown 是一种通过标记字符,对内容进行样式更改的语法。

比方说,在常见的富文本编辑器中,如果我想要加粗一段话,需要用鼠标选择对应的文本,然后选择加粗选项或Ctrl+B

但在 Markdown 编辑器中,我只需要在需要加粗的文本开头和结尾加上两个*即可,例如:**加粗这段话**

这种方式避免了富文本编辑器的两个不足:

  1. 使用 Markdown 编辑器时,你则只需要专注内容的输出,无需离开键盘即可完成:编辑(文本字符) - 排版(标记字符);
  2. 最后的呈现结果一致,可预见。不用担心格式错误或者样式变化。


实际上,现在主流的 Markdown 的编辑器还能够实现富文本编辑器的优势:所见即所得。

以 Typora 为例,在文本编辑过程中,就能够实时预览最终的呈现方式。

图/Typora

最后推荐两款我个人觉得不错,且都支持实时预览的 Markdown 编辑器:一个是免费开源的 Typora,颜值颇高,功能强大,不过据说快要收费了。

另一个是 坚果云Markdown,同样免费无广告,并且还可以实时同步,支持黑夜模式。

点击体验:坚果云Markdown

以上