Markdown语法教程

学习 Markdown 的基础语法,从入门到精通。

Markdown语法教程

Markdown 语法教程目录

Markdown 是什么

Markdown 是一种轻量级标记语言,排版语法简洁,让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档,可与HTML混编,可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写,Markdown被大量使用,如Github、Wikipedia、简书等。

Markdown 编辑器

Markdown 入门的最佳方式就是多使用它。由于有大量免费工具的存在,上手 Markdown 是很方便的。比较遗憾的一点是各平台可能采用不同语言实现的 Markdown 解析引擎,例如 Gridea 和 Luogu 就不同,而且可能有不同程度的定制与扩展,这导致在不同平台上使用 Markdown 写作时体验并不完全一致。不过幸好对于大家公认的一些标准语法,各家都是支持的。
你甚至都不需要下载任何程序,就可以使用在线 Markdown 编辑器(右键以上链接选择 在新标签页中打开链接)来编写 Markdown。进入其站点就可以开始在左侧窗格中书写了。渲染后的文档在右侧窗格预览。

阅读本指南时,你可以打开在线 Markdown 编辑器(右键以上链接选择 在新标签页中打开链接)。这样,你就可以一边学习 Markdown 语法一边练习了。熟悉 Markdown 之后,再选择一个顺手的 Markdown 的应用程序。

Markdown 标题语法

Markdown 的标题是在行首插入 1166## 和标题文字之间使用一个或多个空格,对应到标题 1166 级。

警告

标题不用来强调,滥用标题可能会让读者感到困惑。

预览

源码

# 1级标题 
## 2级标题 
### 3级标题 
#### 4级标题 
##### 5级标题 
###### 6级标题 
这是正文

可选语法

还可以在文本下方添加任意数量的 == 号来标识一级标题,或者 -- 号来标识二级标题。

警告
如果你想在一句正文后添加分割线,请使用***而非---避免错误地标识二级标题。

预览

源码

1级标题 
===============
2级标题
---------------

Markdown 强调语法

通过将文本设置为粗体、斜体、删除线、高亮来强调其重要性。

预览

双等于号高亮
单星号斜体
单下划线斜体
双星号加粗
双下划线加粗
删除线
混合效果

源码

==双等于号高亮==
*单星号斜体*
_单下划线斜体_
**双星号加粗**
__双下划线加粗__
~~删除线~~
***==混合效果==***

如果要在文字前后直接插入普通的星号或底线,可以用反斜线(\)(参见下面的“转义字符”部分)。

预览

*使用反斜线开头的*被当做是普通的字符*

源码

\*使用反斜线开头的\*被当做是普通的字符\*

Markdown 代码语法

大段代码

Markdown 建立代码块的方法:将 ``` 置于这段代码的首行和末行,独立成一行。第一行的 ``` 后面可以加上语言名称,例如 c++、java、c、pascal、markdown、latex 等。

预览

#include<bits/stdc++.h>
using namespace std;

int main(){
  int a, b;
  cin >> a >> b;
  cout << a + b << endl;
  return 0;
}

源码

```c++
#include<bits/stdc++.h>
using namespace std;

int main(){
  int a, b;
  cin >> a >> b;
  cout << a + b << endl;
  return 0;
}
```

小段代码

需要引用代码时,如果引用的语句只有一段,不分行,可以用 ` 将语句包起来。

预览

这样 不分行引用代码 就行了。

源码

这样 `不分行引用代码` 就行了。

Markdown 引用语法

预览

Markdown 标记区块引用的方法是在行的最前面加 >

也可以只在整个段落的第一行最前面加上 >

区块引用内部可以嵌套,只要根据层次加上不同数量的 > 即可。

我是内部嵌套区块,我可以使用其他 Markdown 语法哦。

引用区块内可以使用标题语法。

//在引用区块内可以加入代码块
import java.net.URL;
import java.util.Arrays;
import java.util.Date;
import java.util.Set;

源码

> Markdown 标记区块引用的方法是在行的最前面加 `>`。
> 
> 也可以只在整个段落的第一行最前面加上 `>`。
> > 区块引用内部可以嵌套,只要根据层次加上不同数量的 `>` 即可。
> > 
> > *我是内部嵌套区块,我可以使用其他 Markdown 语法哦。*
> > 
> > ### 引用区块内可以使用标题语法。
> > - [x] Yes,可以加入列表.
> > - [ ] No,可以加入列表.
> > ```java
> > //在引用区块内可以加入代码块
> > import java.net.URL;
> > import java.util.Arrays;
> > import java.util.Date;
> > import java.util.Set;
> > ```

Markdown 列表语法

Markdown 支持有序列表和无序列表以及任务列表。无序列表使用星号、加号或是减号作为列表标记,有序列表则使用数字接着一个英文句点。两种列表方式格式都是:列表标记 + 空格 + 列表项,即列表项目标记通常是放在最左边,也可以缩进最多 33 个空格,项目标记后面则一定要接着至少一个空格或制表符。
列表可以嵌套。

无序列表

星号、加号或是减号三种列表方式效果等同。

预览

  • Red
  • Green
  • Blue
  • Red
  • Green
    • Blue
  • Red
    • Green
      • Blue

源码

*   Red
*   Green
*   Blue

+   Red
+   Green
    +   Blue

-   Red
    -   Green
         -   Blue

有序列表

有序列表则使用数字接着一个英文句点 . 或英文括号 (,添加带有数字和周期的行项。数字不必按数字顺序排列,但列表应从数字 11 开始。

预览

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

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

  1. First item
  2. Second item
  3. Third item
    1. 缩进项
    2. 缩进项
  4. Fourth item

源码

1. First item
2. Second item
3. Third item
4. Fourth item
---
1. First item
1. Second item
1. Third item
1. Fourth item
---
1) First item
3) Second item
8) Third item
    1) 缩进项
    2) 缩进项
5) Fourth item

任务列表

务列表是一种特殊的列表,它可以在列表项前添加复选框,用于表示任务是否完成。任务列表的格式为:- [ ] 任务项 或 - [x] 任务项,其中 [ ] 表示未完成任务,[x] 表示已完成任务。

预览

源码

- [ ] 学习 Markdown 语法
- [x] 完成 Markdown 语法学习
- [ ] 编写 Markdown 文档

Markdown 链接语法

使用链接带给读者更好的网站跳转效果和渲染机制。

美观链接

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

预览

行内式链接标题(无title)
行内式链接标题(有title),可将光标移至链接上查看 title 效果。

行内式 链接 标题(含 Markdown 语法)

源码

[行内式链接标题(无title)](https://ruying-suixing.github.io/)
[行内式链接标题(有title),可将光标移至链接上查看 title 效果。](https://ruying-suixing.github.io/ "可选标题")
## [**行内式** _链接_ 标题(含 Markdown 语法)](https://ruying-suixing.github.io/ "可选标题")

自动链接

Markdown 支持以比较简短的自动链接形式来处理网址和电子邮件信箱,只要是用尖括号包起来,Markdown 就会自动把它转成链接。一般网址的链接文字就和链接地址一样。

预览

https://ruying-suixing.github.io/ 这个是自动链接
https://ruying-suixing.github.io/ 这个是文本

源码

<https://ruying-suixing.github.io/>
https://ruying-suixing.github.io/

Markdown 图片语法

Markdown 使用一种和链接很相似的语法来标记图片。在互联网上发表含有图片的内容时,需要将该图片上传至可公开访问的存储空间内(也就是俗称的图床),可以使用图床上传图片后复制图片引用地址来使用该图片,行内式的图片语法如下:
![图片下方文字](图片相对路径或绝对路径)
![图片下方文字](图片相对路径或绝对路径 "可选标题")
详细叙述如下:一个英文感叹号 !,接着一个方括号,里面放上图片的替代文字(这些文字将在图片加载失败的时候显示),接着一个普通括号,里面放上图片的网址,最后还可以用引号包住并加上选择性的 title 文字,像链接语法一样。

预览

无title:我的博客图片
有title,可将光标移至图片上查看 title 效果:我的博客图片
无用链接,有title,可将光标移至错误文字上查看 title 效果:我的博客图片
图片套链接:我的博客图片

源码

无title:![我的博客图片](https://cdn.luogu.com.cn/upload/usericon/1620655.png) 
有title,可将光标移至图片上查看 title 效果:![我的博客图片](https://cdn.luogu.com.cn/upload/usericon/1620655.png "可选标题") 
无用链接,有title,可将光标移至错误文字上查看 title 效果:![我的博客图片](https://cdn.luogu.com.cn/upload/usericon/9999999.png "可选标题")
图片套链接:[![我的博客图片](https://cdn.luogu.com.cn/upload/usericon/1620655.png "可选标题") ](https://ruying-suixing.github.io/)

Markdown 转义语法

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

渲染效果如下:

* 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

预览

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

源码

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

Markdown 分隔线语法

要创建分隔线,请在单独一行上使用三个或多个星号 (***)、破折号 (---) 或下划线 (___) ,并且不能包含其他内容。

预览

这是第一段内容。




这是第二段内容。

源码

这是第一段内容。
***

---

_________________
这是第二段内容。

Markdown 表格语法

使用 | 划分单元格,并使用 : 与三个及以上的 - 在第二行用于调整对齐。

预览

我是左对齐 我是居中对齐 我是右侧对齐
内容 内容 内容

源码

| 我是左对齐 | 我是居中对齐 | 我是右侧对齐 |
|:---|:---:|---:|
| 内容 | 内容 | 内容 |

源码中单元格宽度可以变化,如下所示。呈现的输出将看起来相同。

预览

我是左对齐 我是居中对齐 我是右侧对齐
内容 内容 内容

源码

| 我是左对齐 | 我是居中对齐 | 我是右侧对齐 |
|    :---    |    :---:     |    ---:     |
|    内容    |     内容     |     内容     |

表格行数可以变化,如下所示。

预览

我是左对齐 我是居中对齐 我是右侧对齐
内容 内容 内容
内容 内容 内容
内容 内容 内容
内容 内容 内容
内容 内容 内容

源码

| 我是左对齐 | 我是居中对齐 | 我是右侧对齐 |
|:---|:---:|---:|
| 内容 | 内容 | 内容 |
| 内容 | 内容 | 内容 |
| 内容 | 内容 | 内容 |
| 内容 | 内容 | 内容 |
| 内容 | 内容 | 内容 |

表格可以使用 HTML 合并单元格,如下所示。

预览

我是标题1 我是标题2
我是第 1 行
内容 我是第 2 列
内容

源码

<table>
    <thead>
        <tr>
            <th>我是标题1</th>
            <th>我是标题2</th>
        <tr>
    </thead>
    <tbody>
        <tr>
            <td colspan="2">我是第 1 行</td>
        </tr>
        <tr>
            <td>内容</td>
            <td rowspan="2">我是第 2 列</td>
        </tr>
        <tr>
            <td>内容</td>
        <tr>
    </tbody>
<table>    

❗️警告
现在即将进入

高难度扩展部分。

请做好准备。

Markdown 注释语法

部分网站不可用。

脚注使您可以添加注释和参考,而不会使文档正文混乱。当您创建脚注时,带有脚注的上标数字会出现在您添加脚注参考的位置。读者可以单击链接以跳至页面底部的脚注内容。
要创建脚注参考,请在方括号([^1])内添加插入符号和标识符。标识符可以是数字或单词,但不能包含空格或制表符。标识符仅将脚注参考与脚注本身相关联-在输出中,脚注按顺序编号。 在括号内使用另一个插入符号和数字添加脚注,并用冒号和文本([^1]: My footnote.)。您不必在文档末尾添加脚注。您可以将它们放在除列表,块引号和表之类的其他元素之外的任何位置。

预览

体验放在文尾了,这里先放图片。

源码

这里有个简单的脚注,[^1] 这里有个更长的例子。[^2]
[^1]: 这是第一个脚注。
[^2]: 这里有一个有多段代码的文章。
      缩进段落以包含在脚注中。
      `{ 我的代码 }`
      ### 你可以添加任意**多段**的段落和语法。

Markdown 内嵌 HTML 语法

HTML 的行级內联标签不受限制,可以在 Markdown 的段落、列表或是标题里任意使用。依照个人习惯,甚至可以不用 Markdown 格式,而采用 HTML 标签来格式化。可以直接使用这些标签,而不用 Markdown 提供的语法。当你需要更改元素的属性时(例如为文本指定颜色或更改图像的宽度),使用 HTML 标签更方便些。

预览

这是一个普通的段落。

这是红色文字。

这是绿色文字。

我的博客图片
Foo

这也是一个普通的段落。

源码

这是一个<strong>普通</strong>的段落。
<p style="color: red;">这是红色文字。</p>
<p style="color: cyan;">这是绿色文字。</p>
<img src="https://cdn.luogu.com.cn/upload/usericon/1620655.png" alt="我的博客图片" title="Magic Gardens" class="medium-zoom-image">

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

这也是一个<strong>普通</strong>的段落。

Markdown 下划线语法

Markdown 不支持下划线,可能是因为网页文本中的下划线通常表示超链接。然而,可能需要使用下划线。一些应用支持文本下划线,但如果你的 Markdown 处理器支持 HTML,可以使用 <ins> 标签。

预览

一些文字将被加下划线

源码

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

Markdown 缩进语法

Markdown 里的空格和制表符有特殊用途,比如创建换行或代码块。如果你想用 Tab 缩进段落(如在段落前空两格),可以尝试以下方法。

预览

    这是一个缩进的段落。

源码

&nbsp;&nbsp;&nbsp;&nbsp;这是一个缩进的段落。

Markdown 对齐语法

Markdown 没有文本对齐的语法,但可以使用 HTML 标签 <center>(已废弃)或 CSS 解决。

预览

这段文字居左显示(默认居左)。

这段文字居中显示。

这段文字居右显示。

源码

<p style="text-align:left">这段文字居左显示(默认居左)。</p>
<p style="text-align:center">这段文字居中显示。</p>
<p style="text-align:right">这段文字居右显示。</p>

Markdown 注释语法

Markdown 没有内置的注释功能,但可以使用一种非官方的 Hack 方法。

预览

这是可见的段落。

这是另一个可见的段落。

源码

这是可见的段落。

[这是一个隐藏的注释]: # 

这是另一个可见的段落。

Markdown 警告语法

Markdown 没有警告框功能,但可以使用引用块(>)+ Emoji + 加粗模拟。
Emoji:在大多数情况下,您可以简单地从 Emojipedia 等来源复制表情符号并将其粘贴到文档中。许多Markdown应用程序会自动以Markdown格式的文本显示表情符号。

预览

⚠️ 警告: 不要按下大红色按钮!

📝 注意: 日出很美。

💡 提示: 记得珍惜生活中的小事。

源码

> ⚠️ **警告:** 不要按下大红色按钮!

> 📝 **注意:** 日出很美。

> 💡 **提示:** 记得珍惜生活中的小事。

Markdown 调图语法

Markdown 不能指定图片尺寸,但可以用 HTML 设定宽高,图片将以 n×m 像素显示。

预览

源码

<img src="file://C:/Users/22790/Documents/Gridea/post-images/1765888137261.png" width="200" height="200">
<img src="file://C:/Users/22790/Documents/Gridea/post-images/1765888137261.png" width="100" height="100">
<img src="file://C:/Users/22790/Documents/Gridea/post-images/1765888137261.png" width="50" height="50">

Markdown 新标语法

Markdown 不能指定在新标签页打开链接,但 HTML 可以。

预览

打开我的博客!

源码

<a href="https://ruying-suixing.github.io/" target="_blank">打开我的博客!</a>

Markdown 符号语法

Markdown 不能直接插入特殊符号,但可以复制粘贴,或者使用 HTML。

预览

版权 (©) — ©
注册商标 (®) — ®
商标 (™) — ™
欧元 (€) — €
左箭头 (←) — ←
上箭头 (↑) — ↑
右箭头 (→) — →
下箭头 (↓) — ↓
度数 (°) — °
圆周率 (π) — π

源码

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

Markdown 表格扩展

Markdown 不能直接在表格中换行或插入列表,但可以用 HTML 解决。

预览

语法 描述
换行 第一段。

第二段。
语法 描述
列表
  • 项目一
  • 项目二

源码

| 语法      | 描述         |
| --------- | ----------- |
| 换行      | 第一段。<br><br>第二段。 |

| 语法      | 描述         |
| --------- | ----------- |
| 列表      | <ul><li>项目一</li><li>项目二</li></ul> |

Markdown 视频语法

Markdown 不能直接嵌入视频,但可以使用 HTML,点击B站的分享图标,然后选择嵌入链接,会获得代码。

预览

源码

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

Markdown 折叠框语法

Markdown 不能直接使用可点击打开的折叠框,但可以使用 HTML,请在 summaryp 间键入词句以改变效果。

预览

点我打开

真好玩!

我已自动打开,点我关闭

求别关我😖。

点我打开

真好玩!

源码

<details><details>
    <summary>
        点我打开
    </summary>
    <p>真好玩!</p>
</details>
<details open>
    <summary>
        我已自动打开,点我关闭
    </summary>
    <p>求别关我😖。</p>
</details>
    <summary>
        点我打开
    </summary>
    <p>真好玩!</p>
</details>
订阅