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

Posted 极客飞兔

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了编程技巧│高级 markdown 编辑器的惊艳语法相关的知识,希望对你有一定的参考价值。

✨ 目录

🎈 markdown 编辑器

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

🎈 段落标题

  • 语法
# 这是一级标题
## 这是二级标题
### 这是三级标题
#### 这是四级标题
##### 这是五级标题
###### 这是六级标题
  • 效果

🎈 字体样式

  • 语法
**这是加粗的文字**

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

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

~~这是加删除线的文字~~
  • 效果

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

🎈 段落引用

  • 语法
# 可以无限递归
>这是引用的内容
>>这是引用的内容
>>>>>>>>>>这是引用的内容
  • 效果

这是引用的内容

这是引用的内容

这是引用的内容

🎈 分隔线

  • 语法
---
----
***
*****
  • 效果




🎈 插入图片

  • 语法
# 第一种最普通的插入方式
![图片标题](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)
  • 效果

🎈 超链接

  • 语法
[链接名](超链接地址)
# 示例
[飞兔小哥博客首页](https://autofelix.blog.csdn.net/)
  • 效果

飞兔小哥博客首页

🎈 无序列表

  • 语法
- 列表内容
+ 列表内容
* 列表内容
  • 效果
  • 列表内容
  • 列表内容
  • 列表内容

🎈 有序列表

  • 语法
# 数字加点
1. 列表内容
2. 列表内容
3. 列表内容
  • 效果
  1. 列表内容
  2. 列表内容
  3. 列表内容

🎈 插入代码

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

# 多行代码语法,\\需要去除
\\```java
  ...代码内容...
  ...代码内容...
  ...代码内容...
\\```
  • 效果
public class _ 
    public static void main(String[] args) 
        System.out.println("我是飞兔小哥");
    

🎈 插入表格

  • 语法
| 姓名 | 年龄 | 年级 |
|-|-|-|
|极客飞兔|23|大一|
|飞兔小哥|28|大四|
  • 效果
姓名年龄年级
极客飞兔23大一
飞兔小哥28大四

🎈 代码diff

  • 语法
# 其中\\需要去除\\```diff
const unique = (arr) => 
	- return Array.from(new Set(arr))
	+ return [...new Set(arr)]

\\```
  • 效果
const unique = (arr) => 
	- return Array.from(new Set(arr))
	+ return [...new Set(arr)]

🎈 数学公式

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

# 块公式使用方法
$$H(D_2) = -\\left(\\frac24\\log_2 \\frac24 + \\frac24\\log_2 \\frac24\\right) = 1$$

# 矩阵
$$
  \\beginpmatrix
  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 \\\\
  \\endpmatrix
$$
  • 效果

H ( D 2 ) = − ( 2 4 log ⁡ 2 2 4 + 2 4 log ⁡ 2 2 4 ) = 1 H(D_2) = -\\left(\\frac24\\log_2 \\frac24 + \\frac24\\log_2 \\frac24\\right) = 1 H(D2)=(42log242+42log242)=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 ) \\beginpmatrix 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 \\\\ \\endpmatrix 111a1a2ama12a22am2a1na2namn

🎈 注脚

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

极客飞兔 1 致力于带大家做一些有趣的事情 2,希望你能够应用 Markdown3 编辑器进行书写

🎈 流程图

  • 语法
```mermaid
flowchat
st=>start: 开始
op=>operation: 去飞兔小哥博客首页
cond=>condition: 是/否?
e=>end
st->op->cond
cond(yes)->e
cond(no)->op
&```
  • 效果
Created with Raphaël 2.3.0 开始 关注一波飞兔小哥 是/否? End yes
  1. 飞兔小哥是一位荣获CSDN领域之星、阿里云专家博主、华为云云享专家等等各种称号的专家博主 ↩︎

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

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

以上是关于编程技巧│高级 markdown 编辑器的惊艳语法的主要内容,如果未能解决你的问题,请参考以下文章

多年经验总结,写出最惊艳的 Markdown 高级用法

多年经验总结,写出最惊艳的 Markdown 高级用法

那些令我惊艳的小技巧

Markdown语法整理

前端小技巧:加载并解析Markdown文档

Markdown高级语法