Markdown的基本语法

作者: 李阿昀 | 来源:发表于2016-05-09 23:23 被阅读5854次

Markdown是一种轻量级的[标记语言]，它的优点很多，目前也被越来越多的写作爱好者，撰稿者广泛使用。看到这里请不要被[标记]、[语言]所迷惑，Markdown的语法十分简单。常用的标记符号也不超过十个，这种相对于更为复杂的HTML标记语言来说，Markdown可谓是十分轻量的，学习成本也不需要太多，且一旦熟悉这种语法规则，会有一劳永逸的效果。

废话不多说，直接开干，来看看Markdown的基本语法规则。

标题

标题是每篇文章都需要也是最常用的格式，在Markdown中，如果一段文字被定义为标题，只须在这段文字前加#号即可。
例，

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

效果：

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

以此类推，总共六级标题，建议在#号后加一个空格，这是最标准的Markdown语法。
特别的，还可使用=(高阶标题)和-(次阶标题)标记一级和二级标题。
例，

这是高阶标题(效果和一级标题一样)
=
这是次阶标题(效果和二级标题一样)
-

效果：
这是高阶标题(效果和一级标题一样)
=
这是次阶标题(效果和二级标题一样)

注意：=和-标记标题时，=和-的个数在不同的编辑器中都有不同，我在简书中测试时，=和-的个数大于等于2个都可以表示，但是在Cmd Markdown中只要1个就可表示，还有说必须要三个或者以上的，我真不知道该相信谁的了，谁能告诉我！

段落

段落的前后要有空行，所谓的空行是指没有文字内容。若想在段内强制换行的方式是使用两个或以上空格加上回车（引用中换行省略回车）。

列表

熟悉HTML的同学肯定知道有序列表与无序列表的区别，在Markdown下，列表的显示只需要在文字前加上-、+或*即可变为无序列表，有序列表则直接在文字前加1. 2. 3.符号和文字之前加上一个字符的空格。
例1，有序列表

1. 第一点
2. 第二点
4. 第三点

效果：

第一点
第二点
第三点

例2，无序列表

- 这是无序列表项目
+ 这是无序列表项目
* 这是无序列表项目

效果：

这是无序列表项目

这是无序列表项目

这是无序列表项目

两个列表之间不能相邻，否则会解释为嵌套的列表。下面这个是嵌套的列表，例3，

+ 呵呵
    * 嘉嘉
    - 嘻嘻
    - 吼吼
        - 嘎嘎
        + 桀桀
* 哈哈

效果：

呵呵
- 嘉嘉
- 嘻嘻
- 吼吼
  - 嘎嘎
  - 桀桀

哈哈

注意：

标记后面最少有一个空格或制表符。
若不在引用区块中，必须和前方段落之间存在空行，后面最好还是空一行，否则会解释为嵌套的列表。
有序列表标记不是按照你写的数字进行显示的，而是根据当前有序列表标记所在位置显示的，如示例1所示。
无序列表的项目符号是按照实心圆、空心圆、实心方格的层级关系递进的，如例3所示。通常情况下，同一层级使用同一种标记表示，便于自己查看和管理。

引用

如果你需要引用一小段别处的句子，那么就要用引用的格式。只需要在文本前加入>这种尖括号(大于号)即可。
例，

> 这是引用

效果：

这是引用

特别的，引用还可以嵌套，如：

> 这是一级引用
>> 这是二级引用
>>> 这是三级引用

> 这是一级引用

效果：

这是一级引用

这是二级引用

这是三级引用

这是一级引用

再如：

> 这是一级引用
>> 这是二级引用
>>> 这是三级引用
> 这是一级引用

效果：

这是一级引用

这是二级引用

这是三级引用
这是一级引用

从上面两例可看出，如果>、>>和>>>等嵌套使用的话，从>>>退到>时，必须之间要加上一个空行作为过渡，否则默认为下一行和上一行是同一级别的引用。如上例所示。
引用完之后，必须再空一行，重新一个新的开始，否则，以后的文字都将在引用的范围内，不要问我为什么，实践出真知。

代码块

使用```表示代码块。如：

``` javascript
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
```

效果：

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");

注意：

`这个符号是反引号，我一开始在键盘上死命的找还找不到呢？闹笑话了，这个符号在Esc键下面，切换到英文下即可。

```后面的javascript表示此段代码为javascript代码，Markdown会自行使用javascript代码颜色渲染。
附加：还可使用4个空格或者一个制表符（tab）缩进表示代码区块。如：

 /** 
   * nth element in the fibonacci series. 
   * @param n >= 0 
   * @return the nth element, >= 0. 
   */
 function fib(n) { 
     var a = 1, b = 1; 
     var tmp; 
     while (--n >= 0) { 
         tmp = a;
         a += b; 
         b = tmp;
     }
     return a; 
 }
 document.write(fib(10));

效果：

/** 
 * nth element in the fibonacci series. 
 * @param n >= 0 
 * @return the nth element, >= 0. 
 */
function fib(n) {
    var a = 1, b = 1; 
    var tmp; 
    while (--n >= 0) { 
        tmp = a;
        a += b; 
        b = tmp;
    }
    return a; 
}
document.write(fib(10));

但是这样写代码太费劲了，每行的开头都要空4个空格啊！要是成千上万行代码呢？那不把人累死啊！这种方式一定是差评啊！
少量的代码还可以接受啊！例，

    void main()
    {
        printf("Hello, Markdown.");
    }

效果：

void main()
{
    printf("Hello, Markdown.");
}

行内代码

使用``表示行内代码。如：

这是`java`代码。

效果：
这是java代码。
注意：需要和普通段落之间存在空行。

链接

链接可以由两种形式生成：行内式和参考式。

使用[](link "Optional title")表示行内链接。其中

[]内的内容为要添加链接的文字
link为链接地址
Optional title为显示标题。显示效果为在你将鼠标放到链接上后，会显示一个小框提示，提示的内容就是Optional title里的内容。中文显示乱码啊！差评

例，

这就是行内链接：[李阿昀的简书](http://www.jianshu.com "李阿昀的简书")

效果：
这就是行内链接：李阿昀的简书

参考式链接

例，

这里我们参考：
1. [JavaScript | MDN][1]
2. [ECMAScript 6 入门 阮一峰][2]
3. [InfoQ JavaScript][3]
[1]: http://developer.mozilla.org/zh-CN/docs/Web/JavaScript
[2]: http://es6.ruanyifeng.com
[3]: http://www.infoq.com/cn/javascript/?utm_source=infoq&utm_medium=header_graybar&utm_campaign=topic_clk

效果：
这里我们参考：

[JavaScript | MDN][1]
[ECMAScript 6 入门阮一峰][2]
[InfoQ JavaScript][3]
[1]: http://developer.mozilla.org/zh-CN/docs/Web/JavaScript
[2]: http://es6.ruanyifeng.com
[3]: http://www.infoq.com/cn/javascript/?utm_source=infoq&utm_medium=header_graybar&utm_campaign=topic_clk
注意：
上述的[1]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript不出现在区块中。
参考式链接和行内链接的显示效果是一样的。但是在编辑状态下的使用情况不一样。行内连接紧跟链接文字，可以在看到链接文字的同时清楚的知道链接地址，但是不便于多次重复利用。参考式链接可以重复使用，但一般都是将一些链接放在一起统一管理，如一段文字后面或文章结尾，因此在找到链接和链接文字的对应关系上有些麻烦。各有利弊了，分情况使用。

图片

插入图片与插入链接的语法很像，区别在一个!号，而且也有行内式和参考式两种。
插入图片语法为：![Alt text](/path/to/img.jpg "Optional title")

Alt text为如果图片无法显示时显示的文字。
/path/to/img.jpg为图片所在路径。
Optional title为显示标题。显示效果为在你将鼠标放到图片上后，会显示一个小框提示，提示的内容就是Optional title。

例，行内式：

### 插入图片
![图灵社区](http://www.turingbook.com/Content/img/Turing.Gif)

效果：

插入图片

图灵社区

例，参考式：

[图灵社区][4]
![图灵社区Logo][5]
[1]: http://www.ituring.com.cn
[2]: http://www.turingbook.com/Content/img/Turing.Gif

效果：
[图灵社区][4]
![图灵社区Logo][5]
[4]: http://www.ituring.com.cn
[5]: http://www.turingbook.com/Content/img/Turing.Gif

插入图片的地址需要图床(什么是图床呢???)，这里推荐围脖图床修复计划与CloudApp的服务，生成URL地址即可。
推荐工具
图床工具用来上传图片获取URL地址。

首次上传本地图片时，发现Cmd Markdown对普通用户不友好，搞的差点放弃了，还得进阶为高级用户上传本地图片功能才能使用，但我穷啊！以上推荐工具我也没用，什么是图床工具，我都不清楚，还是不搞了。
哈哈，那我就用新浪微博或者QQ空间存储照片了，搞笑吧！

强调

使用**或__表示粗体。
使用*或_表示斜体。
例，

**粗体1**   __粗体2__
*斜体1*   _斜体2_

效果：
粗体1 粗体2
斜体1 斜体2
注意：前后的*或_与要加粗或倾斜的字体之间不能有空格。

表格

表格应该是Markdown比较累人的地方，语法真是操蛋！
用|表示表格纵向边界，表头和表内容用-隔开，并可用:进行对齐设置，两边都有:则表示居中，若不加:则默认左对齐。
详细说明：

----:为右对齐
:----为左对齐
:---:为居中对齐
-----为默认左对齐

注意：-这样的分隔符至少要有1个！目前测试是这样的！
例1，

| 序号 | 交易名 | 交易说明 | 备注 |
| ---: | :----: | :------- | ---- |
|   1  | prfcfg | 菜单配置 | 可以通过此交易查询到所有交易码和菜单的对应关系 |
|   2  | gentmo | 编译所有交易 |  |
|   100000  | sysdba | 数据库表模型汇总 |  |

这种语法生成的表格如下：

序号	交易名	交易说明	备注
1	prfcfg	菜单配置	可以通过此交易查询到所有交易码和菜单的对应关系
2	gentmo	编译所有交易
100000	sysdba	数据库表模型汇总

例2，

| Tables        | Are           | Cool  |
| ------------- |:-------------:| -----:|
| col 3 is      | right-aligned |\$1600 |
| col 2 is      | centered      |  \$12 |
| zebra stripes | are neat      |    $1 |

这种语法生成的表格如下：

Tables	Are	Cool
col 3 is	right-aligned	$1600
col 2 is	centered	$12
zebra stripes	are neat	$1

例3，

dog | bird | cat
----|------|----
foo | foo  | foo
bar | bar  | bar
baz | baz  | baz

这种语法生成的表格如下：

dog	bird	cat
foo	foo	foo
bar	bar	bar
baz	baz	baz

注意：最好还是和普通段落之间存在空行吧！虽然在Cmd Markdown中是不需要空一行的，但是在简书中测试就操蛋了。

分割线

分割线最常使用就是三个或以上*，还可以使用-和_。
例，

***

---

___

效果：

注意：

只要*或者-大于等于三个就可组成一条平行线。
使用---作为水平分割线时，要在它的前后都空一行，防止---被当成标题标记的表示方式。

反斜杠

使用\表示反斜杠，相当于反转义作用。在你不想显示Markdown标记时可以使用反斜杠。
Markdown支持的转义字符列表：

\   反斜线
`   反引号
*   星号
_   底线
{}  花括号
[]  方括号
()  括弧
#   井字号
+   加号
-   减号
.   英文句点
!   惊叹号

删除线

使用~~表示删除线。
例，

~~这是一条删除线~~

效果：
~~这是一条删除线~~
注意：~~和要添加删除线的文字之间不能有空格。

注脚

使用[^footer1]表示注脚。
例，

这是一个注脚测试[^footer1]
[^footer1]: 这是一个测试，用来阐释注脚。

效果：
这是一个注脚测试^[1]

标签分类

使用标签:或者Tags:表示标签标记。
例，

标签: 数学 英语
Tags: 数学 英语

效果(有个毛的效果)：
标签: 数学英语
Tags: 数学英语
注意：

标签:或者Tags:中的冒号要使用半角冒号
基本没使用过这个标记，不过应用场景应该是归类。便于快速了解文章分类。难道可以通过某种方式来遍历到标签标记？不甚了解。如你知道：请告诉我。

锚点

锚点功能可参考Github(我还未玩，忽略)。在Github的md 文件中，会为每个h1~h6标签，自动塞入一个a标签，并渲染好id。
例，

# h1

以上md语言被渲染成html如下：

<h1><a id="user-content-h1" class="anchor" href="#h1" aria-hidden="true"><svg aria-hidden="true" class="octicon octicon-link" height="16" role="img" version="1.1" viewBox="0 0 16 16" width="16"><path d="M4 9h1v1h-1c-1.5 0-3-1.69-3-3.5s1.55-3.5 3-3.5h4c1.45 0 3 1.69 3 3.5 0 1.41-0.91 2.72-2 3.25v-1.16c0.58-0.45 1-1.27 1-2.09 0-1.28-1.02-2.5-2-2.5H4c-0.98 0-2 1.22-2 2.5s1 2.5 2 2.5z m9-3h-1v1h1c1 0 2 1.22 2 2.5s-1.02 2.5-2 2.5H9c-0.98 0-2-1.22-2-2.5 0-0.83 0.42-1.64 1-2.09v-1.16c-1.09 0.53-2 1.84-2 3.25 0 1.81 1.55 3.5 3 3.5h4c1.45 0 3-1.69 3-3.5s-1.5-3.5-3-3.5z"></path></svg></a>h1</h1>

不去管svg部分，可以看到h1标签内嵌入了一个id为 "user-content-h1"的a标签，如果标题为# html5，那么id就会是 user-content-html5。这样就可以用类似下面的语句对其进行跳转定位：

[快点我，我要跳转到h1所在的位置](#user-content-h1)

效果：一点击快点我，我要跳转到h1所在的位置,即跳转到h1所在的位置。

我的参考如下：

[Markdown，你只需要掌握这几个][6]
[markdown在博客园的使用][7]
[怎样使用Markdown][8]
[Markdown 基本语法][9]
[Markdown——入门指南][10]
[Markdown入门指南][11]
[Markdown语法说明(简体中文版)][12]
[6]: http://www.cnblogs.com/crazyant007/p/4220066.html
[7]: http://www.cnblogs.com/zichi/p/4788229.html
[8]: http://www.ituring.com.cn/article/23
[9]: https://github.com/younghz/Markdown
[10]: http://www.jianshu.com/p/1e402922ee32
[11]: http://www.jianshu.com/p/468f111d8fd3
[12]: http://wowubuntu.com/markdown

这是一个测试，用来阐释注脚。 ↩

网友评论

simon96:写Markdown费事？Typora让你像写word一样行云流水。

Typora入门：https://www.simon96.online/
钱学敏:大兄弟写的好
Chayeen:刚开始看 Markdown，可能说得不太对。参见http://blog.csdn.net/witnessai1/article/details/52551362这个链接里面对注脚的用法，可以对文中的一些词汇、概念在文末统一解释，而且能够来回跳转，还是挺方便的。

Markdown

本文标题：Markdown的基本语法

本文链接：https://www.haomeiwen.com/subject/ggzsrttx.html

延伸阅读

深度阅读

您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

Markdown的基本语法

标题

一级标题

二级标题

三级标题

四级标题

五级标题

六级标题

段落

列表

引用

代码块

行内代码

链接

图片

插入图片

强调

表格

分割线

反斜杠

删除线

注脚

标签分类

锚点

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读

Markdown