Markdown 基本语法

December 1, 2020

参考文档:https://www.markdownguide.org/basic-syntax/

常用 Markdown 编辑器:Typora,Marktext

Markdown 编辑器支持部分 HTML 标签语法,支持程度需要看每个应用的具体实现,使用时查看对应应用文档。

HTML 可以跟 Markdown 语法混用。

1. 普通用法

1.1. 标题

语法:

| markdown | html | | ---------------- | ---------------- | | # 标题一 | <h1>标题1</h1> | | ## 标题二 | <h2>标题2</h2> | | #### 标题三 | <h3>标题3</h3> | | ##### 标题四 | <h4>标题4</h4> | | ###### 标题五 | <h5>标题5</h5> | | ####### 标题六 | <h6>标题6</h6> |

效果如下 :

标题1

标题2

标题3

标题4

标题5
标题6
标题替代语法:

在文字下方加上任意个 ==,等于# 标题1;加上任意个 ,等于 ## 标题2

标题一
=========

标题二
---------

标题最佳实践:建议标题与上下的段落之间空一行或多行。不要靠的太近。

1.2. 段落

| markdown | html | | ------------------------------------------------------------ | ------------------------------------------------------------ | | 我是一个段落,手动换行到下一个段落,一般情况下,我只需要坐对齐就好不用在前面加空格或tab 进行缩进 | <p>我是一个段落,一般情况下,我只需要坐对齐就好不用在前面加空格或tab 进行缩进</p> |

段落最佳实践:

  1. 不要在段落前加空格或 tab
  2. 尽量保持段落是左边对齐;
  3. 一般编辑器使用回车,会自动空一行。所以回车可以用来分隔两个段落。如果觉得间隔不够,可以增加多一行或多行空行。
  4. 使用 <br> 进行断行;

1.3. 粗体、斜体、斜体加粗、删除线

语法:

| Markdown | HTML | | ---------------------------- | ------------------------------------------------ | | *倾斜的字体* | <em>倾斜的字体啊</em> | | **加粗的字体** | <strong>加粗的字体</strong> | | ***加粗的倾斜字体*** | <strong><em>加粗的倾斜字体</em></strong> | | ~~带删除线的字体~~ | |

效果如下:

倾斜的字体

加粗的字体

加粗的倾斜字体

是 ~~带删除线的字体~~ 啊

最佳实践:上面几个字体中,使用的 * 号都可以换成 _ ,例如:加粗 __加粗字体__。但不推荐使用下划线 _

1.4. 引用

语法:
> 这是一段引用的内容,引用自某个名人的某句话
>> 两层嵌套的引用
>>> 3(n)层嵌套的引用
> ###### 在引用中使用其他 Markdown 语法
> - 标题
> - **粗体** 等等
效果如下:

这是一段引用的内容,引用自某个名人的某句话

两层嵌套的引用

3(n)层嵌套的引用

在引用中使用其他 Markdown 语法

在引用中使用其他 Markdown 语法
  • 标题
  • 粗体 等等

1.5. 列表

1.5.1 有序列表

语法:

Markdown:

1. 第一项
2. 第二项
3. 第三项
  1. 可以嵌套列表
  2. 可以嵌套列表
4. 第四项

1. 第一项
1. 第二项
6. 第三项
8. 第四项

列表显示的顺序,与前面数字无关

HTML:

<ol>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项
    <ol>
      <li>可以嵌套列表</li>
      <li>可以嵌套列表</li>
    </ol>
  </li>
  <li>第四项</li>
</ol>
效果如下:
  1. 第一项
  2. 第二项
  3. 第三项
  4. 可以嵌套列表
  5. 可以嵌套列表
  6. 第四项

1.5.2 无序列表

语法:

Markdown:

- 第一项
- 第二项
- 第三项
  - 可以嵌套列表
  - 可以嵌套列表

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

+ 第一项
* 第二项
- 第三项

 推荐统一使用 *-

HTML:

<ul>
  <li>第一项</li>
  <li>第二项</li>
  <li>第三项
    <ul>
      <li>可以嵌套列表</li>
      <li>可以嵌套列表</li>
    </ul>
  </li>
</ul>
效果如下:
  • 第一项
  • 第二项
  • 第三项
    • 可以嵌套列表
    • 可以嵌套列表

使用 2 个或 4 个空格或一个 tab,缩进元素项,即可使该项成为上个元素的子元素项

1.6 代码

1.6.1 行内代码

语法:

使用``<code></code> 包裹住行内代码块。

| Markdown | HTML | | ------------------------------------ | ----------------------------------- | | `log("hello, world")` | <code>log("hello, world")</code> |

` 一般在 ESC 键下方

显示效果:

log("hello, world")

1.6.2 代码块

语法:

使用 tab 缩进或 使用前后分别使用 ``` 包裹住代码块

使用 tab 缩进
	function() {
		console.log('hello, world')
	}

使用 ``` 包裹住代码块
```javascript
	function() {
		console.log('hello, world')
	}
```
显示效果:
	function() {
		console.log('hello, world')
	}

前后的 ``` 必须占单独一行,第一个 ``` 后面跟着个的单词,描述包裹着的代码块使用的语言

1.7 分割线

语法:

一行内只有连续三个或三个以上的 *-_

***
---
_________
显示效果:

1.8 链接

1.8.1 行内链接

语法:

Markdown:

[链接描述文字](链接地址 "title")

其中 "title" 是鼠标悬停在文字上面会出现的提示内容。选填。

例如:
文字链接:[我的个人网站](https://www.silinchen.com "技术学习、研究、分享")
纯链接:<https://www.silinchen.com>
邮箱:<fake@example.com>

HTML:

<a href="https://www.silinchen.com" title="技术学习、研究、分享">我的个人网站<a>
显示效果:

文字链接:我的个人网站

纯链接:

邮箱:<fake@example.com>

1.8.2 参考式链接:

参考式链接将文字描述与链接地址分开,使编辑时文字更易于阅读,或一个链接在多个地方使用的时候,可以复用。

参考式链分两部分:1. 在行内使用超链接。2.在文件内任意地方定义好超链接地址。

语法:

[文字描述] [链接标记]

文字链接:[我的个人网站][1]

在文中其他任意地方定义链接地址, title 可选。一般定义在使用到超链接的段落后面,或集中在文件结尾:
[1]: https://www.silinchen.com
[1]: https://www.silinchen.com "技术学习、研究、分享"

显示效果:

我的个人网站

链接可以配置其他语法使用,例如:加粗 我的个人网站。链接地址也可以是一个 锚点。

如果链接中有存在空格,最好把空格替换成 %20

1.9 图片

语法:

Markdown:

![图片alt](图片地址 "图片title"),其中 "图片title" 是鼠标悬停在图片上面会出现的提示内容。选填。

图片:![markdown](https://www.silinchen.com/post-images/markdown-basic-syntax/i-love-markdown.jpg "i love markdown")
带链接的图片:[![markdown](https://www.silinchen.com/post-images/markdown-basic-syntax/i-love-markdown.jpg "i love markdown")](https://www.silinchen.com "markdown 语法大全")

HTML:

<img src="https://www.silinchen.com/post-images/markdown-basic-syntax/i-love-markdown.jpg" width="200"/>
显示效果:

图片:

markdown

带链接的图片:

markdown

HTML 语法:设置图片宽为 200

1. 10 转义字符

在含有特殊意义的字符前面加上反斜杆 \

例如:
\*
\-

常见的特殊字符:

| 特殊字符 | 字符名称 | | -------- | -------------- | | \ | 反斜杆 | | ` | 反引号 | | * | 星号 | | _ | 下划线 | | | 大括号 | | [] | 中括号 | | () | 小括号 | | # | 井号 | | + | 加号 | | - | 减号(连字符) | | . | 点 | | ! | 感叹号 | | | | 管道 |

1.11 表格

语法:

表格分三部分

第一部分是表头,用管道符 | 隔开。

第二部分是隔开表头跟表内容的,由管道符 |- 组成,- 可以是一个或多个,纯 - 代表左对齐,--: 右边加 : 代表右对齐,:--: 两边都加 : 代表居中。

第三部分是表内容,同样用管道符 | 隔开。

|表头  |表头 |表头 |
|-----|----:|:--:|
|左对齐|右对齐|居中|
|左对齐|右对齐|居中|
...
显示效果:

| 表头 | 表头 | 表头 | | ----- | ----: | :-: | | 左对齐 | 右对齐 | 居中啊 | | 左对齐 | 右对齐 | 居中啊 |

2. 扩展用法

2.1 目录显示

输入 [TOC] 即可显示目录

2.2 设置文字的颜色、大小、字体

markdown 编辑器不一定支持这种语法

语法:

使用 <font> 标签,通过标签属性控制颜色、大小、字体

  • face 设置文字字体
  • color 设置文字颜色
  • size 设置文字大小,取值从 1 到 7,默认值是 3.
<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>
<font color=red>我是红色</font>
<font color=#008000>我是绿色</font>
<font color=Blue>我是蓝色</font>
<font size=5>我是尺寸</font>
<font face="黑体" color=green size=4>我是黑体,绿色,尺寸为4</font>
显示效果:
我是黑体字 我是微软雅黑 我是华文彩云 我是红色 我是绿色 我是蓝色 我是尺寸5 我是黑体,绿色,尺寸为4

2.3 设置文字背景色

由于 style 标签和标签的 style 属性不被支持,所以这里只能是借助 table, tr, td 等表格标签的 bgcolor 属性来实现背景色。故这里对于文字背景色的设置,只是将那一整行看作一个表格,更改了那个格子的背景色(bgcolor)。

语法:
<table><tbody><tr><td bgcolor="yellow">背景色yellow</td></tr></tbody></table>
显示效果:
背景色yellow

2.4 TODO 列表

语法:

类似无序列表,不过,增加了 [][x] 分别表示未完成与完成。同样是可以嵌套子级列表。

- [ ] a task list item
- [ ] list syntax required
- [ ] normal **formatting**, @mentions, #1234 refs
- [ ] incomplete
- [x] completed
显示效果:
  • [ ] a task list item
  • [ ] list syntax required
  • [ ] normal formatting, @mentions, #1234 refs
  • [ ] incomplete
  • [x] completed

2.5 LaTeX 公式

2.5.1 行内公式

语法:

使用两个美元符号 $ 包裹住公式内容。

$e^\{ix\} = cosx + isinx$
显示效果:

$e^{ix} = cosx + isinx$

x = \dfrac{-b \pm \sqrt{b^2 - 4ac}}{2a} 
[\frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } }]