编程技巧│高级 markdown 编辑器的惊艳语法

✨ 目录

• • 🎈 markdown 编辑器
  • 🎈 段落标题
  • 🎈 字体样式
  • 🎈 段落引用
  • 🎈 分隔线
  • 🎈 插入图片
  • 🎈 超链接
  • 🎈 无序列表
  • 🎈 有序列表
  • 🎈 插入代码
  • 🎈 插入表格
  • 🎈 代码diff
  • 🎈 数学公式
  • 🎈 注脚
  • 🎈 流程图

🎈 markdown 编辑器

• markdown 编辑器是一种易读易写的纯文本格式编写文档
• 作为程序员专属的 markdown 编辑器，你不会还不会用吧
• 反正如果你想摆脱千篇一律的文章排版就用它吧
• 有些 markdown 编辑器还会提供各种各样的主题，让你的文章看起来非常的炫酷
• 并且对于图片、图表、数学式都有支持
• 现在基本所有技术网站都支持使用 Markdown 来撰写帮助文档或是用于论坛上发表消息评论等

🎈 段落标题

• 语法

# 这是一级标题
## 这是二级标题
### 这是三级标题
#### 这是四级标题
##### 这是五级标题
###### 这是六级标题
1
2
3
4
5
6

• 效果

🎈 字体样式

• 语法

**这是加粗的文字**

*这是倾斜的文字*
_这是倾斜的文字_

***这是斜体加粗的文字***
**_这是斜体加粗的文字_**

~~这是加删除线的文字~~
1
2
3
4
5
6
7
8
9

• 效果

这是加粗的文字
这是倾斜的文字
这是倾斜的文字
这是斜体加粗的文字
这是斜体加粗的文字
这是加删除线的文字

🎈 段落引用

• 语法

# 可以无限递归
>这是引用的内容
>>这是引用的内容
>>>>>>>>>>这是引用的内容
1
2
3
4

• 效果

这是引用的内容

这是引用的内容

这是引用的内容

🎈 分隔线

• 语法

---
----
***
*****
1
2
3
4

• 效果

---

---

---

---

🎈 插入图片

• 语法

# 第一种最普通的插入方式
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png)

# 第二种带尺寸的图片
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png =60x60)

# 第三种宽度确定高度等比例的图片
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png =60x)

# 第四种高度确定宽度等比例的图片
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png =x60)

# 第五种居中的图片
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png#pic_center)

# 第六种居中并且带尺寸的图片
![图片标题](https://img-home.csdnimg.cn/images/20220524100510.png#pic_center =60x60)

# 第七种居右的图片
![Alt](https://img-home.csdnimg.cn/images/20220524100510.png#pic_right)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

• 效果

🎈 超链接

• 语法

[链接名](超链接地址)
# 示例
[飞兔小哥博客首页](https://autofelix.blog.csdn.net/)
1
2
3

• 效果

飞兔小哥博客首页

🎈 无序列表

• 语法

- 列表内容
+ 列表内容
* 列表内容
1
2
3

• 效果
• 列表内容

• 列表内容

• 列表内容

🎈 有序列表

• 语法

# 数字加点
1. 列表内容
2. 列表内容
3. 列表内容
1
2
3
4

• 效果

1. 列表内容
2. 列表内容
3. 列表内容

🎈 插入代码

• 语法

# 单行代码语法
`代码内容`

# 多行代码语法，\需要去除
\```java
  ...代码内容...
  ...代码内容...
  ...代码内容...
\```
1
2
3
4
5
6
7
8
9

• 效果

public class _ {
    public static void main(String[] args) {
        System.out.println("我是飞兔小哥");
    }
}
1
2
3
4
5

🎈 插入表格

• 语法

| 姓名 | 年龄 | 年级 |
|-|-|-|
|极客飞兔|23|大一|
|飞兔小哥|28|大四|
1
2
3
4

• 效果

🎈 代码diff

• 语法

# 其中\需要去除
​\```diff
const unique = (arr) => {
	- return Array.from(new Set(arr))
	+ return [...new Set(arr)]
}
\```
1
2
3
4
5
6
7

• 效果

const unique = (arr) => {
	- return Array.from(new Set(arr))
	+ return [...new Set(arr)]
}
1
2
3
4

🎈 数学公式

• 语法

# 行内公式使用方法
$E=mc^2$

# 块公式使用方法
$$H(D_2) = -\left(\frac{2}{4}\log_2 \frac{2}{4} + \frac{2}{4}\log_2 \frac{2}{4}\right) = 1$$

# 矩阵
$$
  \begin{pmatrix}
  1 & a_1 & a_1^2 & \cdots & a_1^n \\
  1 & a_2 & a_2^2 & \cdots & a_2^n \\
  \vdots & \vdots & \vdots & \ddots & \vdots \\
  1 & a_m & a_m^2 & \cdots & a_m^n \\
  \end{pmatrix}
$$
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

• 效果

$$H(D_2)=-\left(\frac{2}{4}{\log }_2\frac{2}{4}+\frac{2}{4}{\log }_2\frac{2}{4}\right)=1$$

( 1 a 1 a 1 2 ⋯ a 1 n 1 a 2 a 2 2 ⋯ a 2 n ⋮ ⋮ ⋮ ⋱ ⋮ 1 a m a m 2 ⋯ a m n ) (1a1a21⋯an11a2a22⋯an2⋮⋮⋮⋱⋮1ama2m⋯anm)

⎝ ⎛​11⋮1​a1​a2​⋮am​​a12​a22​⋮am2​​⋯⋯⋱⋯​a1n​a2n​⋮amn​​⎠ ⎞​

🎈 注脚

• 语法
• 脚注内容请拉到最下面观看

极客飞兔 [^1] 致力于带大家做一些有趣的事情 [^2]，希望你能够应用 Markdown[^Ty] 编辑器进行书写
[^1]: 飞兔小哥是一位荣获CSDN领域之星、阿里云专家博主、华为云云享专家等等各种称号的专家博主
[^2]: 有趣的事情当然是教会大家如何把自己卷的更优秀
[^Ty]: 程序员专属编辑器，你别告诉我你还不会用
1
2
3
4

• 效果

极客飞兔 ¹ 致力于带大家做一些有趣的事情 ²，希望你能够应用 Markdown³ 编辑器进行书写

🎈 流程图

• 语法

```mermaid
flowchat
st=>start: 开始
op=>operation: 去飞兔小哥博客首页
cond=>condition: 是/否?
e=>end
st->op->cond
cond(yes)->e
cond(no)->op
&```
1
2
3
4
5
6
7
8
9
10

• 效果

---

1. 飞兔小哥是一位荣获CSDN领域之星、阿里云专家博主、华为云云享专家等等各种称号的专家博主 ↩︎

2. 有趣的事情当然是教会大家如何把自己卷的更优秀 ↩︎

3. 程序员专属编辑器，你别告诉我你还不会用 ↩︎