Markdown写作常用组件

本文总结了Markdown中一些基本的语法和经常使用的组件环境，方便在写作过程中随时复制使用。

基本语法

标题

markdown 复制代码

# Heading level 1	
## Heading level 2
### Heading level 3
#### Heading level 4
##### Heading level 5
###### Heading level 6

段落

要创建段落，请使用空白行将一行或多行文本进行分隔。

markdown 复制代码

I really like using Markdown.

I think I'll use it to format all of my documents from now on.

换行

在一行的末尾添加两个或多个空格 ，然后按回车键，即可创建一个换行(<br>)。

markdown 复制代码

This is the first line.  
And this is the second line.

强调

markdown 复制代码

**粗体**
*斜体*
***粗斜体***

粗体

斜体

粗斜体

引用

要创建块引用，请在段落前添加一个 > 符号。

markdown 复制代码

> Dorothy followed her through many of the beautiful rooms in her castle.
>
> The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

Dorothy followed her through many of the beautiful rooms in her castle.

The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

嵌套块引用

markdown 复制代码

> Dorothy followed her through many of the beautiful rooms in her castle.
>
>> The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

Dorothy followed her through many of the beautiful rooms in her castle.

The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

列表

要在保留列表连续性的同时在列表中添加另一种元素（段落，引用块、代码块、图片、列表），请将该元素缩进四个空格或一个制表符，如下例所示：

markdown 复制代码

1. First item
2. Second item
3. Third item
    - Indented item
    - Indented item
4. Fourth item

First item
Second item
Third item
- Indented item
- Indented item
Fourth item

行中代码

要将单词或短语表示为代码，请将其包裹在反引号 (`) 中。转义反引号可以通过将单词或短语包裹在双反引号(``)中。

markdown 复制代码

At the command prompt, type `nano`.

``Use `code` in your Markdown file.``

At the command prompt, type nano.

Use `code` in your Markdown file.

分隔线

为了兼容性，请在分隔线的前后均添加空白行。

markdown 复制代码

Try to put a blank line before...

---

...and after a horizontal rule.

链接

基本语法

markdown 复制代码

这是一个链接 [Markdown语法](https://markdown.com.cn)。

这是一个链接 Markdown语法。

给链接增加 Title

链接title是当鼠标悬停在链接上时会出现的文字，这个title是可选的，它放在圆括号中链接地址后面，跟链接地址之间以空格分隔。

markdown 复制代码

这是一个链接 [Markdown语法](https://markdown.com.cn "最好的markdown教程")。

这是一个链接 Markdown语法。

网址和Email地址

使用尖括号可以很方便地把URL或者email地址变成可点击的链接。

plaintext 复制代码

<https://markdown.com.cn>
<fake@example.com>

https://markdown.com.cn

fake@example.com

带格式化的链接

plaintext 复制代码

I love supporting the **[EFF](https://eff.org)**.
This is the *[Markdown Guide](https://www.markdownguide.org)*.

I love supporting the EFF.

This is the Markdown Guide.

图片

要添加图像，请使用感叹号 (!), 然后在方括号增加替代文本，图片链接（可以是本地或网页图片）放在圆括号里，括号里的链接后可以增加一个可选的图片标题文本。

插入图片Markdown语法代码：![图片alt](图片链接 "图片title")。

markdown 复制代码

![这是图片](/assets/img/philly-magic-garden.jpg "Magic Gardens")

转义字符

要显示原本用于格式化 Markdown 文档的字符，请在字符前面添加反斜杠字符 \。

markdown 复制代码

\* Without the backslash, this would be a bullet in an unordered list.

渲染效果如下：

* Without the backslash, this would be a bullet in an unordered list.

可做转义的字符

Character	Name
\	backslash
`	backtick
*	asterisk
_	underscore
{}	curly braces
[]	brackets
()	parentheses
#	pound sign
+	plus sign
-	minus sign (hyphen)
.	dot
!	exclamation mark
\|	pipe

特殊字符自动转义

在 HTML 文件中，有两个字符需要特殊处理： < 和 & 。 < 符号用于起始标签，& 符号则用于标记 HTML 实体，如果你只是想要使用这些符号，你必须要使用实体的形式，像是 < 和 &，对应的 > 是 >。

在 Markdown 的块级元素和内联元素中， < 和 & 两个符号都会被自动转换。

在 HTML 语法（包括在 Markdown 文件中使用的 HTML 语法）中，要手动把所有的 < 和 & 都转换为 HTML 实体。

Markdown 内嵌 HTML 标签

行级內联标签

HTML 的行级內联标签如 <span>、<cite>、<del> 不受限制，可以在 Markdown 的段落、列表或是标题里任意使用。HTML 行级內联标签和区块标签不同，在內联标签的范围内， Markdown 的语法是可以解析的。

markdown 复制代码

This **word** is bold. This <em>word</em> is italic.

渲染效果如下:

This word is bold. This word is italic.

区块标签

区块元素──比如 <div>、<table>、<pre>、<p> 等标签，必须在前后加上空行 ，以便于内容区分。而且这些标签的开始与结尾标签，不可以用 tab 或是空白来缩进 。Markdown 会自动识别这区块元素，避免在区块标签前后加上没有必要的 <p> 标签。

例如，在 Markdown 文件里加上一段 HTML 表格：.

markdown 复制代码

This is a regular paragraph.

<table>
    <tr>
        <td>Foo</td>
    </tr>
</table>

This is another regular paragraph.

请注意，Markdown 语法在 HTML 区块标签中将不会被进行处理。

扩展语法

表格

要添加表，请使用三个或多个连字符（---）创建每列的标题，并使用管道（|）分隔每列。您可以选择在表的任一端添加管道。

markdown 复制代码

| Syntax      | Description |
| ----------- | ----------- |
| Header      | Title       |
| Paragraph   | Text        |

呈现的输出如下所示：

Syntax	Description
Header	Title
Paragraph	Text

可以在表格中设置文本格式。例如，您可以添加链接，代码（仅反引号（`）中的单词或短语，而不是代码块）和强调。

您不能添加标题，块引用，列表，水平规则，图像或HTML标签。

若想在表格中打出（|）字符，可以使用表格的HTML字符代码（|）来转义管道字符（|）。

围栏代码块

markdown 复制代码

```c
#include <stdio.h>

int main(){
	printf("Hello,World!\n");
	
	return0;
}
```

c 复制代码

#include <stdio.h>

int main(){
	printf("Hello,World!\n");
	
	return0;
}

脚注

要创建脚注参考，请在方括号（[^1]）内添加插入符号和标识符。标识符可以是数字或单词，但不能包含空格或制表符。

在括号内使用另一个插入符号和数字添加脚注，并用冒号和文本（[^1]: My footnote.）。不必在文档末尾添加脚注。可以将它们放在除列表，块引号和表之类的其他元素之外的任何位置。

markdown 复制代码

Here's a simple footnote,[^1] and here's a longer one.[^bignote]

[^1]: This is the first footnote.

[^bignote]: Here's one with multiple paragraphs and code.

    Indent paragraphs to include them in the footnote.

    `{ my code }`

    Add as many paragraphs as you like.

呈现的输出效果如下：

Here's a simple footnote,^[[1]](#[1]) and here's a longer one.^[[2]](#[2])

删除线

plaintext 复制代码

~~世界是平坦的。~~ 我们现在知道世界是圆的。

世界是平坦的。我们现在知道世界是圆的。

任务列表

markdown 复制代码

- [x] Write the press release
- [ ] Update the website
- [ ] Contact the media

Write the press release
Update the website
Contact the media

使用 Emoji 表情

有两种方法可以将表情符号添加到Markdown文件中：

将表情符号复制并粘贴到Markdown格式的文本中
或者键入表情简码

表情包来源：

Emojipedia
表情符号简码列表
Windows下快捷键Win + .来选择想要添加的Emoji表情

高级操作

Markdown 作为轻量级标记语言，有一定的局限性，但借助 HTML 和 CSS，可以实现许多 Markdown 不支持的功能。

下划线

如果你的 Markdown 处理器支持 HTML，可以使用 <ins> 或 <u>标签：

plaintext 复制代码

一些文字 <ins>将被加下划线</ins>。
一些文字 <u>将被加下划线</u>。

一些文字 ++将被加下划线++。

文字居中

markdown 复制代码

<p style="text-align:center">这段文字居中显示。</p>

这段文字居中显示。

文字颜色

Markdown 不支持更改文字颜色，但 HTML 可以：

markdown 复制代码

<font color="red">这段文字是红色的！</font>
<p style="color:blue">这段文字是蓝色的。</p>

这段文字是红色的！

这段文字是蓝色的。

符号（特殊字符）

Markdown 不能直接插入特殊符号，但可以复制粘贴，或者使用 HTML 实体：

plaintext 复制代码

版权 (©) --- &copy;
注册商标 (®) --- &reg;
商标 (™) --- &trade;
欧元 (€) --- &euro;
左箭头 (←) --- &larr;
上箭头 (↑) --- &uarr;
右箭头 (→) --- &rarr;
下箭头 (↓) --- &darr;
度数 (°) --- &#176;
圆周率 (π) --- &#960;

渲染效果：

版权 (©) --- ©

注册商标 (®) --- ®

商标 (™) --- ™

欧元 (€) --- €

左箭头 (←) --- ←

上箭头 (↑) --- ↑

右箭头 (→) --- →

下箭头 (↓) --- ↓

度数 (°) --- °

圆周率 (π) --- π

插入视频

Markdown 不能直接嵌入视频，但可以使用 HTML，或变通方式（图片+链接）

点击B站的分享图标，然后选择嵌入链接，会获得如下代码：

html 复制代码

<iframe src="//player.bilibili.com/player.html?isOutside=true&aid=114980686925459&bvid=BV1y1twzqE9n&cid=31548313549&p=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>

或者

markdown 复制代码

[![视频预览](https://img.youtube.com/vi/YOUTUBE-ID/0.jpg)](https://www.youtube.com/watch?v=YOUTUBE-ID)

渲染效果：

代码块折叠

Show Code

cpp 复制代码

这里填充代码

HTML语法:

html 复制代码

<details> 
<summary><font size="4" color="orange">Show Code</font></summary> 
<pre><code class="language-cpp">这里填充代码</code>
</pre> </details>

标签解释:

plaintext 复制代码

details:折叠语法
summary:折叠语法展示的摘要
pre:以原有格式显示元素内的文字是已经格式化的文本
code：指定代码块

注意事项：

对于代码块中的 <>的特殊符号应该用 \< \>代替，不然会显示错误。比如<stdio.h>要写成\<stdio.h\>。
<code>必须紧贴代码开头（避免多出首行），\</code>需单独一行（避免少了尾行）
代码块内部不能有空行

图片居中

实现语法如下：

html 复制代码

<div align=center><img src="https://invinc-z-drawing-bed.oss-cn-shanghai.aliyuncs.com/img/202311161556943.png" alt="单向链表结构-示意图" style="zoom: 33%;" /></div>

Markdown 表格单元格合并（跨行、跨列）及文本换行

参考解决方案

示例

		选择排序	冒泡排序	插入排序
时间复杂度	最佳情况	O(n^2)	O(n)	O(n)
时间复杂度	平均情况	O(n^2)	O(n^2)	O(n^2)
时间复杂度	最坏情况	O(n^2)	O(n^2)	O(n^2)
空间复杂度		O(1)	O(1)	O(1)
稳定性		不稳定	稳定	稳定

实现语法如下：

html 复制代码

<div align=center>
<table>
    <tr>
        <th> </th>
        <th> </th>
        <th>选择排序</th>
        <th>冒泡排序</th>
        <th>插入排序</th>
    </tr>
    <tr>
        <td rowspan="3">时间复杂度</td>
        <td>最佳情况</td>
        <td> O(n^2) </td>
        <td> <b>O(n)</b> </td>
        <td> <b>O(n)</b> </td>
    </tr>
    <tr>
        <td>平均情况</td>
        <td> O(n^2) </td>
        <td> O(n^2) </td>
        <td> O(n^2) </td>
    </tr>
    <tr>
        <td>最坏情况</td>
        <td> O(n^2) </td>
        <td> O(n^2) </td>
        <td> O(n^2) </td>
    </tr>
    <tr>
        <td colspan="2">空间复杂度</td>
        <td> O(1) </td>
        <td> O(1) </td>
        <td> O(1) </td>
    </tr>
     <tr>
        <td colspan="2">稳定性</td>
        <td> 不稳定 </td>
        <td> 稳定 </td>
        <td> 稳定 </td>
    </tr>
</table>
</div>

添加键盘按键图标

html 复制代码

使用 <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Esc</kbd> 打开任务管理器

渲染效果：

使用 Ctrl + Shift + Esc 打开任务管理器

内部锚点跳转

标题自动生成锚点

Markdown 的标题会自动生成一个锚点，链接格式如下：

markdown 复制代码

[要显示的文字](#锚点)

锚点的规则：

原标题	锚点
`# 我的标题`	`#我的标题` → 中英文都直接写
空格会变为 `-`	例如 `我的标题` → `#我的-标题`
全部转换为小写（英文）

点击跳转到基本语法

markdown 复制代码

## 基本语法
...
[点击跳转到基本语法](#基本语法)

自定义锚点（HTML 写法，通用）

适用于：

标题太复杂
标题有特殊字符无法准确匹配
知乎、Typora、Hexo 等平台

写法如下（注意空行要保留）：

markdown 复制代码

<a id="sec2"></a>

## 扩展语法

...
[跳转到扩展语法](#sec2)

点击跳转到扩展语法

参考博文

This is the first footnote. ↩︎
Here's one with multiple paragraphs and code.

Indent paragraphs to include them in the footnote.

{ my code }

Add as many paragraphs as you like. ↩︎