当前位置：网站首页 > 技术文章 > 正文

Markdown 常用语法总结

myzbx 2025-01-21 20:01 38 浏览

头条不能以代码模式查看，所以分两部分来写：效果、语法。效果和语法部分一一对应，最好自己把语法复制下来保存为.md用md编辑器打开。

先看效果：

Markdown 常用语法

注：查阅时在视图中切换为源代码模式

一级标题

二级标题

三级标题

四级标题

五级标题

字体加粗、倾斜、下划线语法

活佛济公地方

也让土地局

很疯狂

ejhgfe

ruhfr

hfhdf

ekgfnekgn

删除

下划线

创建脚注语法

创建脚注脚注1。

[脚注1]

列表格式语法

第一项+ 开发
+ 如果
第二项第一项 - 功夫鱼 - 肌肤第二项第一项第二项1.凡人歌* 饭店
* 通过2.发个人

区块格式语法

> 区块
>
> > rug
> >
> > > rtgj
> > >
> > > + g 
> > >
> > > + 1.ferlkjf
> > >
> > >   2.4rg 
> > >
> > >   + rg 
> > >   + 

* 第一项

  > jfkj 
  >
  > jfrjf
  >
  > > rofj

                                         - 第一项
                                         -

包含代码语法

main() 函数

下面是代码区块

int main(void){

    printf("hello world!\n");

 return 0;

}

````c
  int main(void){
    printf("hello world!\n");
     return 0;
    }
````

/****************************************************/
/*******16进制字符串转换成QString显示（包含中文显示）********/
QString SerialWidget::hexToString(QString str)
{
     QTextCodec *gbk = QTextCodec::codecForName("GBK");  //编码转换

     QByteArray strByte=HexStrToByteArray(str); //16进制字符串转字节数组
     QString QS=gbk->toUnicode(strByte); //必须是转格式，否则中文显示乱码，具体看环境

     return   QS;
}

链接插入语法

这是个链接 [百度] (https://www.baidu.com)

这是个链接 [百度] (www.baidu.com)

用变量设置百度链接百度

[1] www.baidu.com

图片插入语法

表格这样写

姓名	年龄
\| 回复第 \| 巨额罚款 \|

返回	房的	可U发货
发v 的	的vd	热
发vd	而对方	的
的	的	的
地方v

转义字符使用

文本加粗

**rkjf**

数学表达式

加$符号表示：

$
\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\ \end{vmatrix} ${$tep1}{\style{visibility:hidden}{(x+1)(x+1)}}
$

1、横向流程图源码格式：

a=1a=2方形圆角条件a结果1结果2横向流程图

2、竖向流程图源码格式：

a=1a=2方形圆角条件a结果1结果2竖向流程图

3、标准流程图源码格式：

开始框处理框判断框(是或否?)输入输出框结束框子流程yesno

4、标准流程图源码格式（横向）：

开始框处理框判断框(是或否?)输入输出框结束框子流程yesno

5、UML时序图源码样例：

对象A对象A对象B对象B对象B你好吗?（请求）对象B的描述对象A的描述(提示)我很好(响应)你真的好吗？

6、UML时序图源码复杂样例：

标题：复杂使用对象A对象A对象B对象B小三小三CC对象B你好吗?（请求）对象B的描述对象A的描述(提示)我很好(响应)你好吗对象B找我了你真的好吗？我们是朋友没人陪我玩

7、UML标准时序图样例：

张三李四王五王五你好吗？与疾病战斗loop[健康检查]合理 食物看医生...很好!你怎么样?很好!张三李四王五

8、甘特图样例：

2014-01-072014-01-092014-01-112014-01-132014-01-152014-01-172014-01-192014-01-212014-01-23需求学习准备理解需求原型UI设计设计框架开发未来任务未来任务功能测试压力测试测试报告耍设计开发测试软件开发甘特图

字体和颜色设置（内嵌HTML方式）

浅红色文字：浅红色文字：深红色文字：深红色文字浅绿色文字：浅绿色文字深绿色文字：深绿色文字浅蓝色文字：浅蓝色文字深蓝色文字：深蓝色文字浅黄色文字：浅黄色文字深黄色文字：深黄色文字浅青色文字：浅青色文字深青色文字：深青色文字浅紫色文字：浅紫色文字

size为1：size为1 size为2：size为2 size为3：size为3 size为4：size为4 size为10：size为10

我是黑体字我是宋体字我是微软雅黑字我是fantasy字

我是Helvetica字

背景色的设置是按照十六进制颜色值：#7FFFD4

背景色的设置是按照十六进制颜色值：#FF83FA

背景色的设置是按照十六进制颜色值：#D1EEEE

背景色的设置是按照十六进制颜色值：#C0FF3E

背景色的设置是按照十六进制颜色值：#54FF9F

再看语法：

把下面文字复制下来用md打开看效果更佳。

# Markdown 常用语法

### 注：查阅时在视图中切换为源代码模式

----------

# 一级标题

## 二级标题

### 三级标题

#### 四级标题

##### 五级标题

## 字体加粗、倾斜、下划线语法

活佛济公地方

也让土地局

*很疯狂*

_ejhgfe_

**ruhfr**

__hfhdf__

***ekgfnekgn***

****

___

----------

~~删除~~

下划线

## 创建脚注语法

创建脚注[^脚注1]。

[^脚注1]:

## 列表格式语法

* 第一项

+ 开发

+ 如果

* 第二项

----

+ 第一项

- 功夫鱼

- 肌肤

+ 第二项

------

- 第一项

- 第二项

--------------

1.凡人歌

* 饭店

* 通过

2.发个人

## 区块格式语法

> 区块

> > rug

> >

> > > rtgj

> > >

> > > + g

> > >

> > > + 1.ferlkjf

> > >

> > > 2.4rg

> > >

> > > + rg

> > > +

* 第一项

> jfkj

> jfrjf

> > rofj

- 第一项

## 包含代码语法

`main()` 函数

下面是代码区块

int main(void){

printf("hello world!\n");

return 0;

}

````c

int main(void){

printf("hello world!\n");

return 0;

}

````

```c++

/****************************************************/

/*******16进制字符串转换成QString显示（包含中文显示）********/

QString SerialWidget::hexToString(QString str)

{

QTextCodec *gbk = QTextCodec::codecForName("GBK"); //编码转换

QByteArray strByte=HexStrToByteArray(str); //16进制字符串转字节数组

QString QS=gbk->toUnicode(strByte); //必须是转格式，否则中文显示乱码，具体看环境

return QS;

}

```

## 链接插入语法

这是个链接 [百度] (https://www.baidu.com)

这是个链接 [百度] (www.baidu.com)

用变量设置百度链接[百度][1]

[1]:www.baidu.com

## 图片插入语法

![图片图标](C:\Users\ltfy\Pictures\Saved Pictures\51biz_yIsi2XH0.jpg)

![图片 pan](C:\Users\ltfy\Pictures\Saved Pictures\p2.jpg "mypan")

```

## 表格这样写

| 姓名 | 年龄 |

| :----------------------: | ---- |

| \| 回复第 \| 巨额罚款 \| | |

| 返回 | 房的 | 可u发货 | |

| ------ | ------ | ------- | ---- |

| 发v 的 | 的vd | 热 | |

| 发vd | 而对方 | 的 | |

| 的 | 的 | 的 | |

| 地方v | | | |

| | | | |

### 转义字符使用

**文本加粗**

\*\*rkjf\*\*

# 数学表达式

加$符号表示：

\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix}

\mathbf{i} & \mathbf{j} & \mathbf{k} \\

\frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\

\frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \\

\end{vmatrix}

${$tep1}{\style{visibility:hidden}{(x+1)(x+1)}}

## 1、横向流程图源码格式：

```mermaid

graph LR

A[方形] -->B(圆角)

B --> C{条件a}

C -->|a=1| D[结果1]

C -->|a=2| E[结果2]

F[横向流程图]

```

## 2、竖向流程图源码格式：

```mermaid

graph TD

A[方形] --> B(圆角)

B --> C{条件a}

C --> |a=1| D[结果1]

C --> |a=2| E[结果2]

F[竖向流程图]

```

## 3、标准流程图源码格式：

```flow

st=>start: 开始框

op=>operation: 处理框

cond=>condition: 判断框(是或否?)

sub1=>subroutine: 子流程

io=>inputoutput: 输入输出框

e=>end: 结束框

st->op->cond

cond(yes)->io->e

cond(no)->sub1(right)->op

```

## 4、标准流程图源码格式（横向）：

```flow

st=>start: 开始框

op=>operation: 处理框

cond=>condition: 判断框(是或否?)

sub1=>subroutine: 子流程

io=>inputoutput: 输入输出框

e=>end: 结束框

st(right)->op(right)->cond

cond(yes)->io(bottom)->e

cond(no)->sub1(right)->op

```

## 5、UML时序图源码样例：

```sequence

对象A->对象B: 对象B你好吗?（请求）

Note right of 对象B: 对象B的描述

Note left of 对象A: 对象A的描述(提示)

对象B-->对象A: 我很好(响应)

对象A->对象B: 你真的好吗？

```

## 6、UML时序图源码复杂样例：

```sequence

Title: 标题：复杂使用

对象A->对象B: 对象B你好吗?（请求）

Note right of 对象B: 对象B的描述

Note left of 对象A: 对象A的描述(提示)

对象B-->对象A: 我很好(响应)

对象B->小三: 你好吗

小三-->>对象A: 对象B找我了

对象A->对象B: 你真的好吗？

Note over 小三,对象B: 我们是朋友

participant C

Note right of C: 没人陪我玩

```

## 7、UML标准时序图样例：

```mermaid

%% 时序图例子,-> 直线，-->虚线，->>实线箭头

sequenceDiagram

participant 张三

participant 李四

张三->王五: 王五你好吗？

loop 健康检查

王五->王五: 与疾病战斗

end

Note right of 王五: 合理食物 看医生...

李四-->>张三: 很好!

王五->李四: 你怎么样?

李四-->王五: 很好!

```

## 8、甘特图样例：

```mermaid

%% 语法示例

gantt

dateFormat YYYY-MM-DD

title 软件开发甘特图

section 设计

需求 :done, des1, 2014-01-06,2014-01-08

原型 :active, des2, 2014-01-09, 3d

UI设计 : des3, after des2, 5d

未来任务 : des4, after des3, 5d

section 开发

学习准备理解需求 :crit, done, 2014-01-06,24h

设计框架 :crit, done, after des2, 2d

开发 :crit, active, 3d

未来任务 :crit, 5d

耍 :2d

section 测试

功能测试 :active, a1, after des3, 3d

压力测试 :after a1 , 20h

测试报告 : 48h

```

## 字体和颜色设置（内嵌HTML方式）

浅红色文字：浅红色文字：

深红色文字：深红色文字

浅绿色文字：浅绿色文字

深绿色文字：深绿色文字

浅蓝色文字：浅蓝色文字

深蓝色文字：深蓝色文字

浅黄色文字：浅黄色文字

深黄色文字：深黄色文字

浅青色文字：浅青色文字

深青色文字：深青色文字

浅紫色文字：浅紫色文字

----------------

size为1：size为1

size为2：size为2

size为3：size为3

size为4：size为4

size为10：size为10

----------------------------------------------

我是黑体字

我是宋体字

我是微软雅黑字

我是fantasy字

我是Helvetica字

---------------------------------

<table><tr><td bgcolor=#FF00FF>背景色的设置是按照十六进制颜色值：#7FFFD4</td></tr></table>

<table><tr><td bgcolor=#FF83FA>背景色的设置是按照十六进制颜色值：#FF83FA</td></tr></table>

<table><tr><td bgcolor=#D1EEEE>背景色的设置是按照十六进制颜色值：#D1EEEE</td></tr></table>

<table><tr><td bgcolor=#C0FF3E>背景色的设置是按照十六进制颜色值：#C0FF3E</td></tr></table>

<table><tr><td bgcolor=#54FF9F>背景色的设置是按照十六进制颜色值：#54FF9F</td></tr></table>

---------------------------------------------

CSS HEX 颜色

上一篇：Elixir实战:9 隔离错误影响 (1) 监督树
下一篇：B端小细节-如何做好富文本在深色模式的适配?

Markdown 常用语法总结

Markdown 常用语法

注：查阅时在视图中切换为源代码模式

一级标题

二级标题

三级标题

四级标题

五级标题

字体加粗、倾斜、下划线语法

创建脚注语法

列表格式语法

区块格式语法

包含代码语法

链接插入语法

图片插入语法

表格这样写

转义字符使用

数学表达式

1、横向流程图源码格式：

2、竖向流程图源码格式：

3、标准流程图源码格式：

4、标准流程图源码格式（横向）：

5、UML时序图源码样例：

6、UML时序图源码复杂样例：

7、UML标准时序图样例：

8、甘特图样例：

字体和颜色设置（内嵌HTML方式）

我是Helvetica字

相关推荐

使用VSCode模板提高Vue开发效率（vscode开发vue3）

吃透 Vue 项目开发实践|16个方面深入前端工程化开发技巧【下】

说下你的vue项目的目录结构，该怎么划分?

用上Vue3，你真的变了吗?（vue3 key）

8.7k star，一款超炫酷的动态可视化大屏项目

移动前端重构实战系列:5-7章（前端移动端主要技术有哪些）

这么牛逼的cursor功能，赶紧用起来

browser-use:AI 驱动的浏览器自动化神器——DOM识别与交互详解

巧克力:从一朵花开始的华丽变身_巧克力花束教程视频

comfyui安装MimicMotion扩展，AI跳舞动作模仿