【笔记】Markdown学习笔记

发表于 2023-04-16 更新于 2026-06-06 阅读次数：

前言

Markdown是一种轻量级标记语言，创始人为约翰·格鲁伯。它允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的XHTML（或者HTML）文档。（维基百科）

嵌入HTML

Markdown文件内可以直接嵌入HTML标签

1	<div></div>

标准语法（CommonMark）

标题

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

<h1 id="一级标题">一级标题</h1>
<h2 id="二级标题">二级标题</h2>
<h3 id="三级标题">三级标题</h3>
<h4 id="四级标题">四级标题</h4>
<h5 id="五级标题">五级标题</h5>
<h6 id="六级标题">六级标题</h6>

1
2

一级标题
===

1	<h1 id="一级标题">一级标题</h1>

1
2

二级标题
---

1	<h2 id="二级标题">二级标题</h2>

段落

一个空格、多个空格、一个换行都会渲染为空格，只有多个换行才会渲染为换行

文本内容1
文本内容2 文本内容3

文本内容4  文本内容5

1 2	<p>文本内容1 文本内容2 文本内容3</p> <p>文本内容4 文本内容5</p>

列表

无序列表

1 2	* 文本内容 * 文本内容

1 2	- 文本内容 - 文本内容

1 2	+ 文本内容 + 文本内容

<ul>
  <li>
    文本内容
    <ul>
      <li>文本内容</li>
    </ul>
  </li>
</ul>

有序列表

1. 文本内容1
2. 文本内容2
  1. 文本内容3
  2. 文本内容4

<ol type="1">
  <li>文本内容1</li>
  <li>
    文本内容2
    <ol type="1">
      <li>文本内容3</li>
      <li>文本内容4</li>
    </ol>
  </li>
</ol>

引用

1
2
3

> 引用内容1

> 引用内容2

<blockquote>
  <p>引用内容1</p>
  <p>引用内容2</p>
</blockquote>

代码

代码块

通过4个空格缩进实现代码块

1 2	print() print()

<pre>
<code>print()
print()</code>
</pre>

行内代码

`print()`

1
2
3

<p>
  <code>print()</code>
</p>

字体

斜体

*文本内容*

_文本内容_

1	<em>文本内容</em>

粗体

**文本内容**

__文本内容__

1	<strong>文本内容</strong>

粗斜体

1	*文本内容*

1	___文本内容___

1	<em><strong>文本内容</strong></em>

分隔线

***

---

___

<hr />

链接

行内式链接

1	[文本内容](https://example.com/)

1	<a href="https://example.com/">文本内容</a>

引用式链接

1
2
3

[文本内容][1]

[1]: https://example.com/ "标题"

1
2
3

[文本内容][]

[文本内容]: https://example.com/ "标题"

1
2
3

[文本内容]

[文本内容]: https://example.com/ "标题"

1	<a href="https://example.com/" title="标题">文本内容</a>

省略标题

1
2
3

[文本内容][1]

[1]: https://example.com/

1	<a href="https://example.com/">文本内容</a>

自动链接

1	<https://example.com/>

1	<a href="https://example.com/">https://example.com/</a>

图片

1	![替换文本](https://example.com/image.webp)

1	<img src="https://example.com/image.webp" alt="替换文本">

省略替换文本

1	![](https://example.com/image.webp)

1	<img src="https://example.com/image.webp" alt="">

图片链接

1	[![](https://example.com/image.webp)](https://example.com/)

1
2
3

<a href="https://example.com/">
  <img src="https://example.com/image.webp" alt="">
</a>

扩展语法（GitHub Flavored Markdown, GFM）

表格

单元格对齐默认左对齐

|A|B|
|---|---|
|A1|B1|
|A2|B2|

<table>
  <thead>
  <tr>
    <th>A</th>
    <th>B</th>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td>A1</td>
    <td>B1</td>
  </tr>
  <tr>
    <td>A2</td>
    <td>B2</td>
  </tr>
  </tbody>
</table>

指定单元格对齐方向

|A|B|C|
|:---|:---:|---:|
|A1|B1|C1|
|A2|B2|C2|

<table>
  <thead>
  <tr>
    <th style="text-align: left;">A</th>
    <th style="text-align: center;">B</th>
    <th style="text-align: right;">C</th>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td style="text-align: left;">A1</td>
    <td style="text-align: center;">B1</td>
    <td style="text-align: right;">C1</td>
  </tr>
  <tr>
    <td style="text-align: left;">A2</td>
    <td style="text-align: center;">B2</td>
    <td style="text-align: right;">C2</td>
  </tr>
  </tbody>
</table>

列表

任务列表

1 2	- [x] 已完成任务 - [ ] 未完成任务

<ul>
  <li><label><input type="checkbox" checked=""/>已完成任务</label></li>
  <li><label><input type="checkbox"/>未完成任务</label></li>
</ul>

字体

删除线

~~文本内容~~

1	<del>文本内容</del>

代码

围栏式代码块

```
print()
```

高亮代码块

```python
print()
```

<div id="cb1">
  <pre>
    <code>
      <span id="cb1-1">
        <a href="#cb1-1" aria-hidden="true" tabindex="-1"></a>
        <span>print</span>
        ()
      </span>
    </code>
  </pre>
</div>

链接

纯文本自动链接

1	https://example.com/

1	<a href="https://example.com/">https://example.com/</a>

1	user@example.com

1	<a href="mailto:user@example.com">user@example.com</a>

Github

脚注

1
2
3

文本内容[^1]

[^1]: 脚注内容

<p>
  文本内容
  <a href="#fn1" id="fnref1" role="doc-noteref">
    <sup>1</sup>
  </a>

<section id="footnotes" role="doc-endnotes">
  <hr/>
  <ol>
    <li id="fn1">
      <p>
        脚注内容
        <a href="#fnref1" role="doc-backlink">↩︎</a>
      </p>
    </li>
  </ol>
</section>

Emoji表情

:smile:

😊

@提及

@user

1	<a class="user-mention" href="/user">@user</a>

#Issue

#1

1	<a class="issue-link" href="/issues/1">#1</a>

第三方插件

Mermaid流程图

```mermaid
graph TD
  Collection --> List
  Collection --> Set
  Collection --> Map
```

<pre class="mermaid">
  <code>
    graph TD
      Collection --&gt; List
      Collection --&gt; Set
      Collection --&gt; Map
  </code>
</pre>

LaTeX数学公式

行内公式

1	$a^2 + b^2 = c^2$

<span class="math inline">
  <em>a</em><sup>2</sup>
  +
  <em>b</em><sup>2</sup>
  =
  <em>c</em><sup>2</sup>
</span>

公式块

1
2
3

$$
a^2 + b^2 = c^2
$$

<span class="math display">
  <em>a</em>
  <sup>2</sup>
  +
  <em>b</em>
  <sup>2</sup>
  =
  <em>c</em>
  <sup>2</sup>
</span>

完成

参考文献

IDEA Preferences
CSDN——珍妮玛•黛金