Markdown 语法大全详解
Markdown是一种轻量级标记语言,排版语法简洁,让人们更多地关注内容本身而非排版。它使用易读易写的纯文本格式编写文档,可与HTML混编,可导出 HTML、PDF 以及本身的 .md 格式的文件。因简洁、高效、易读、易写,Markdown被大量使用,如Github、Wikipedia、简书等。
1. 样式标题
Markdown 支持使用 #
符号来创建不同级别的标题。#
符号的数量代表了标题的级别。
# 这是 H1 标题
## 这是 H2 标题
### 这是 H3 标题
#### 这是 H4 标题
##### 这是 H5 标题
###### 这是 H6 标题
这是 H1 标题
这是 H2 标题
这是 H3 标题
这是 H4 标题
这是 H5 标题
这是 H6 标题
不同的 Markdown 应用程序处理 # 和标题之间的空格方式并不一致。为了兼容考虑,请用一个空格在 # 和标题之间进行分隔。
2. 段落
段落由一行或多行文本组成,每段之间需要有一个空行隔开。
这是一个段落。它可以包含多个句子。
这是另一个段落。
这是一个段落。它可以包含多个句子。
这是另一个段落。
3. 强调
用于突出显示文本。
斜体
*斜体文本* 或 _斜体文本_
斜体文本 或 斜体文本
粗体
**粗体文本** 或 __粗体文本__
粗体文本 或 粗体文本
斜体和粗体
***斜体加粗文本*** 或 ___斜体加粗文本___
斜体加粗文本 或 斜体加粗文本
4. 列表
列表分为有序列表和无序列表。
无序列表
- 项目 1
- 项目 2
- 项目 3
- 项目 1
- 项目 2
- 项目 3
有序列表
1. 项目 1
2. 项目 2
3. 项目 3
- 项目 1
- 项目 2
- 项目 3
嵌套列表
- 项目 1
- 项目 2
- 子项目 1
- 子项目 2
- 项目 3
- 项目 1
- 项目 2
- 子项目 1
- 子项目 2
- 项目 3
5. 链接
链接可以指向网页或者文件。
[链接文本](https://example.com)
链接文本
6. 图像
插入图像也很简单 这张图片好像没法加载…
![替代文字](https://imagepphcloud.thepaper.cn/pph/image/126/870/199.jpg)
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-B0zSBx1M-1722265538317)(https://imagepphcloud.thepaper.cn/pph/image/126/870/199.jpg)]
7. 代码
内联代码
`内联代码`
内联代码
代码块
\```\n
代码块\n
````\n
代码块
8. 表格
表格可以帮助组织数据。
| 列 1 | 列 2 | 列 3 |
| ---- | ---- | ---- |
| 数据 1 | 数据 2 | 数据 3 |
| 数据 4 | 数据 5 | 数据 6 |
列 1 | 列 2 | 列 3 |
---|---|---|
数据 1 | 数据 2 | 数据 3 |
数据 4 | 数据 5 | 数据 6 |
9. 水平线
水平线用于分隔不同的部分。
---
10. 引用
引用通常用于展示原文。
> 这是一个引用。
这是一个引用。
11. 删除线
~~被删除的文字~~
被删除的文字
12. 任务列表
- [ ] 未完成的任务
- [x] 已完成的任务
- 未完成的任务
- 已完成的任务
13. 数学公式
Markdown 本身不支持数学公式,但许多Markdown编辑器支持使用 LaTeX 格式来插入数学公式。
行内公式
$E = mc^2$
E = m c 2 E = mc^2 E=mc2
独立公式
$$ E = mc^2 $$
E = m c 2 E = mc^2 E=mc2
14. 脚注
脚注可以用来添加额外的信息或引用。
这里有一个脚注[^1]。
[^1]: 这是脚注的内容。
这里有一个脚注1。
15. 定义列表
定义列表用于定义术语或概念。
名词:
: 定义
: 更多解释
-
名词:
- 定义
- 更多解释
16. 代码高亮
对于代码块,可以通过指定语言来实现语法高亮。
\```\n
```python
def hello_world():
print("Hello, world!")
````\n
def hello_world():
print("Hello, world!")
17. 表格对齐
有些Markdown编辑器支持表格中的单元格对齐方式。
| 左对齐 | 居中对齐 | 右对齐 |
| :---- | :-----: | ----: |
| 文本 | 文本 | 文本 |
| 文本 | 文本 | 文本 |
左对齐 | 居中对齐 | 右对齐 |
---|---|---|
文本 | 文本 | 文本 |
文本 | 文本 | 文本 |
18. YAML 前置元数据
Markdown 文件有时会包含YAML格式的前置元数据,用于存储文件的相关信息。
---
title: 我的文章标题
author: John Doe
date: 2024-07-29
---
# 开始正文
title: 我的文章标题
author: John Doe
date: 2024-07-29
开始正文
18. 高级数学公式
一些Markdown编辑器支持使用LaTeX语法来编写更复杂的数学公式。
$$ \int_{-\infty}^{+\infty} e^{-x^2} dx = \sqrt{\pi} $$
∫ − ∞ + ∞ e − x 2 d x = π \int_{-\infty}^{+\infty} e^{-x^2} dx = \sqrt{\pi} ∫−∞+∞e−x2dx=π
19.嵌套引用
将两个引用嵌套起来
> 这是一个引用。
> > 这是一个嵌套引用。
这是一个引用。
这是一个嵌套引用。
20. 转义字符
在Markdown中,如果想要显示某些特殊字符而不是让它们被解析为Markdown语法的一部分,可以使用反斜杠 \
来转义这些字符。
转义字符示例
-
反斜杠 (
\
):\\
\
-
星号 (
*
):\*
*
-
下划线 (
_
):\_
_
-
大括号 (
{}
) 和方括号 ([]
):\{ \} \[ \]
{ } [ ]
-
尖括号 (
<>
):\< \>
< >
-
竖线 (
|
):\|
|
-
反引号 (``):
\`
`
-
井号 (
#
):\#
#
-
减号 (
-
):\-
-
-
点 (
.
) 和感叹号 (!
):\. \!
. !
-
其他特殊字符:例如美元符号
$
、百分号%
等,通常不需要转义,除非在某些特定情况下(如数学公式)需要使用。
示例
假设你想在一个段落中显示星号 *
和下划线 _
而不是让它们被解析为斜体,你可以这样写:
这不是 * 斜体文本 *,也不是 _ 下划线文本 _。
这不是 * 斜体文本 *,也不是 _ 下划线文本 _。
显示结果:
这不是 * 斜体文本 *,也不是 _ 下划线文本 _。
注意
- 在某些情况下,如使用星号或下划线时,只有当它们位于单词边界时才需要转义。例如,在单词中间的下划线或星号通常不需要转义。
- 当使用代码块时,通常不需要转义内部的特殊字符。
- 对于某些Markdown编辑器,你可能需要转义两次才能正确显示转义字符,例如
\\
显示为\
。
21. 内嵌 HTML 标签
在 Markdown 中,任何有效的 HTML 标签都可以直接使用,而不会被 Markdown 解析器特别处理。这意味着你可以使用 HTML 来添加额外的样式或功能,例如 CSS 类、id、表格样式等。
示例
基本 HTML 标签
<b>加粗文本</b>
<i>斜体文本</i>
<em>强调文本</em>
<strong>强烈强调文本</strong>
<small>小字体文本</small>
加粗文本
斜体文本
强调文本
强烈强调文本
小字体文本
使用 CSS 类
<p class="highlight">这是一个带有 CSS 类的段落。</p>
这是一个带有 CSS 类的段落。
使用 CSS id
<p id="my-id">这是一个带有 CSS id 的段落。</p>
这是一个带有 CSS id 的段落。
使用 CSS 样式
<p style="color: red;">这是一个带有内联样式的段落。</p>
这是一个带有内联样式的段落。
使用表格
<table>
<tr>
<th>标题 1</th>
<th>标题 2</th>
</tr>
<tr>
<td>数据 1</td>
<td>数据 2</td>
</tr>
</table>
标题 1 | 标题 2 |
---|---|
数据 1 | 数据 2 |
使用 div
<div class="container">
<p>这是 div 内部的段落。</p>
</div>
这是 div 内部的段落。
使用 span
<span class="important">这是重要的文本。</span>
这是重要的文本。
使用图像
<img src="https://img-home.csdnimg.cn/images/20230724024159.png?be=1&origin_url=https://example.com/image.jpg" alt="示例图像" title="这是示例图像">
使用锚点
<a href="https://example.com" target="_blank">访问示例网站</a>
访问示例网站
使用列表
<ul>
<li>列表项 1</li>
<li>列表项 2</li>
</ul>
- 列表项 1
- 列表项 2
使用注释
<!-- 这是一个 HTML 注释 -->
22. 甘特图
Markdown 本身不支持直接绘制甘特图,但你可以使用Mermaid这样的工具来在Markdown文档中生成甘特图。Mermaid 是一种基于Markdown的图表生成工具,支持甘特图等多种图表。
甘特图示例
gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram functionality to mermaid
section 现有任务
已完成 :done, des1, 2014-01-06,2014-01-08
进行中 :active, des2, 2014-01-09, 3d
计划中 : des3, after des2, 5d
这段代码将生成一个简单的甘特图。
23. UML 图
Mermaid 同样支持多种UML图,包括类图、序列图、活动图等。
类图示例
sequenceDiagram
张三 ->> 李四: 你好!李四, 最近怎么样?
李四-->>王五: 你最近怎么样,王五?
李四--x 张三: 我很好,谢谢!
李四-x 王五: 我很好,谢谢!
Note right of 王五: 李四想了很长时间, 文字太长了<br/>不适合放在一行.
李四-->>张三: 打量着王五...
张三->>王五: 很好... 王五, 你怎么样?
这段代码将生成一个简单的类图。
24. flow 流程图
Mermaid 支持多种图表类型,其中流程图是非常常用的一种。
lowchat
st=>start: 开始
e=>end: 结束
op=>operation: 我的操作
cond=>condition: 确认?
st->op->cond
cond(yes)->e
cond(no)->op
流程图示例
这段代码将生成一个简单的流程图。
25. Mermaid 类图
Mermaid 支持绘制类图,可以用来表示类之间的关系。
graph LR
A[长方形] -- 链接 --> B((圆))
A --> C(圆角长方形)
B --> D{菱形}
C --> D
Class Diagram类图示例
classDiagram
Class01 <|-- AveryLongClass : Cool
Class03 <|-- Class04
Class05 <|-- Class06
Class07 : equals(Class07 other){
}
Class07 : String getName(){
}
Class08 <|-- Class07
Class07 .. Class06 : Cool
Class06 .. Class02 : Super cool
Class04 : implements Interface01
Class05 : implements Interface00
Class06 : implements Interface00
Class07 : implements Interface00
Class08 : implements Interface02
Class09 : implements Interface01
Class04 <|-- Class05
Class04 <|-- Class06
Interface00 <|-- Interface01
Interface00 <|-- Interface02
[Class10] <|-- Class07
Class09 <|-- Class07
Class04 .. Class07 : "Cool"
Class06 .. Class07 : "Super cool"
这段代码将生成一个类图。
这是脚注的内容。 ↩︎