cnblog Markdown 测试

Visual Studio如何编辑并预览markdown

不同特殊占位符所占空白是不一样大的。

【1】  或  //全角
【2】  或  //半角
【3】  或  //半角之半角

内容目录

在段落中填写 [TOC] 以显示全文内容的目录结构。

目录

• 不同特殊占位符所占空白是不一样大的。
• 内容目录
• Markdown 标题
• 我展示的是一级标题
  • 我展示的是二级标题
• 这是一级标题
  • 这是二级标题
    • 这是三级标题
      • 这是四级标题
        • 这是五级标题
          • 这是六级标题
  • 标题编号
    • My Great Heading {#custom-id}
  • 链接到标题ID
  • 定义清单
  • 任务清单
• 段落
• Markdown 可以使用以下几种字体：
  • 更改字体、大小、颜色
  • 为文字添加背景色
  • 设置文字居中
  • 加入上下标
• 分割线
• 删除线
• 下划线
• 脚注
• 列表
  • 在列表中添加元素
  • 块引用
  • 有序列表使用数字并加上 . 号来表示，如：
  • 列表嵌套
• Markdown 区块
  • 嵌套引用
  • 区块中使用列表
  • 列表中使用区块
• Markdown 代码
  • 转义刻度线
• 代码区块
• Markdown 链接
  • 自动网址链接
  • 禁用自动URL链接
  • 高级链接
• Markdown 图片
• Markdown 表格
  • 我们可以设置表格的对齐方式：
• 按键
• 转义
• 横向流程图源码格式：
• 竖向流程图源码格式：
• 标准流程图源码格式：
• 标准流程图源码格式（横向）：
• UML时序图源码样例：
• UML时序图源码复杂样例：
• UML标准时序图样例：
• 甘特图样例：
• 基本图行
• 节点之间的连接
• 子流程图
• 自定义样式
• demo
  • 7. 流程图
    • 示例
  • 8. 序列图
    • 示例 1
    • 示例 2
  • 9. 甘特图
  • 10. Mermaid 流程图
  • 11. Mermaid 序列图
    • 更多语法参考：Mermaid 序列图语法参考

Markdown 标题

Markdown 标题有两种格式。
1、使用 = 和 - 标记一级和二级标题 = 和 - 标记语法格式如下：

我展示的是一级标题

我展示的是二级标题

使用 # 号可表示 1-6 级标题，一级标题对应一个 # 号，二级标题对应两个 # 号，以此类推。

这是一级标题

Heading level 1

这是二级标题

Heading level 2

这是三级标题

Heading level 3

这是四级标题

Heading level 4

这是五级标题

Heading level 5

这是六级标题

Heading level 6

标题编号

许多Markdown处理器支持标题的自定义ID-一些Markdown处理器会自动添加它们。
添加自定义的ID，您可以直接链接到标题，并用CSS修改。要添加自定义
标题ID，请在与标题相同的行上用大括号括起该自定义ID。

My Great Heading {#custom-id}

My Great Heading

链接到标题ID

通过创建带有数字符号（）和自定义标题ID 的标准链接，可以链接到文件中具有自定义ID #的标题。
Heading IDs
Heading IDs

定义清单

一些Markdown处理器允许您创建自定义列表和术语及其相应的定义。要创建定义列表，请在第一行上键入术语。下一行，键入一个冒号后跟一个空格和定义。

First Term

This is the definition of the first term.

Second Term

This is one definition of the second term.

This is another definition of the second term.

First Term

This is the definition of the first term.

Second Term

This is one definition of the second term.

This is another definition of the second term.

任务清单

任务列表使您可以创建带有复选框的项目列表。在支持任务列表的Markdown应
用程序中，复选框将显示在内容旁边。要创建任务列表，请在任务列表项之前添
加破折号（-）和方括号，并[ ]在其前面加上一个空格（）。要选择一个复选框
，请x在方括号（[x]）之间添加in 。

• [x] Write the press release
• [ ] Update the website
• [ ] Contact the media

段落

的换行是使用两个以上空格加上回车
段落1：Hello12432143213413421421
段落2：123412342134123412341234
段落3：2134123421341234134

I really like using Markdown.

I think I'll use it to format all of my documents from now on.

This is the first line.
And this is the second line.

Markdown 可以使用以下几种字体：

这是加粗的文字

这是倾斜的文字

这是斜体加粗的文字

这是加删除线的文字

I just love bold text

Italicized text is the cat's meow.

This text is really important.

更改字体、大小、颜色

我是黑体字
我是微软雅黑
我是华文彩云
我是红色
我是绿色
我是蓝色
我是尺寸
我是黑体，绿色，尺寸为5

为文字添加背景色

背景色yellow

设置文字居中

居中

左对齐

右对齐

加入上下标

使用HTML中下标下标的语法即可, 语法
H₂O CO₂
爆米^TM

分割线

分割线内容1

---

分割线内容2

---

分割线内容3

---

分割线内容4

---

分割线内容5

删除线

如果段落上的文字要添加删除线，只需要在文字的两端加上两个波浪线 ~~ 即可，实例如下：
BAIDU.COM
BAIDU.COM

下划线

下划线可以通过 HTML 的 <u> 标签来实现：
带下划线文本

脚注

脚注是对文本的补充说明。
创建脚注格式类似这样 ^[1]。

列表

Markdown 支持有序列表和无序列表。
无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记，这些标记后面要添加一个空格，然后再填写内容：

例子1

• First item
• Second item
• Third item
• Fourth item

例子2

• First item
• Second item
• Third item
• Fourth item

例子3

• First item

• Second item

• Third item

• Fourth item

对应html

• First item
• Second item
• Third item
• Fourth item

在列表中添加元素

要在保留列表连续性的同时在列表中添加另一个元素，请将该元素缩进四个空格或一个制表符，如以下示例所示。

段落

• This is the first list item.

• Here's the second list item.

  I need to add another paragraph below the second list item.

• And here's the third list item.

块引用

• This is the first list item.

• Here's the second list item.

  A blockquote would look great below the second list item.

• And here's the third list item.

有序列表使用数字并加上 . 号来表示，如：

例子1

1. First item
2. Second item
3. Third item
4. Fourth item

例子2

1. First item
2. Second item
3. Third item
4. Fourth item

例子3

1. First item
2. Second item
3. Third item
4. Fourth item

对应html

1. First item
2. Second item
3. Third item
4. Fourth item

例子4

1. First item
2. Second item
3. Third item
   1. Indented item
   2. Indented item
4. Fourth item

对应html

1. First item
2. Second item
3. Third item
   1. Indented item
   2. Indented item
4. Fourth item

列表嵌套

列表嵌套只需在子列表中的选项前面添加四个空格即可：

1. 第一项：
   • 第一项嵌套的第一个元素
   • 第一项嵌套的第二个元素
2. 第二项：
   • 第二项嵌套的第一个元素
   • 第二项嵌套的第二个元素

Markdown 区块

Markdown 区块引用是在段落开头使用 > 符号 ，然后后面紧跟一个空格符号：

区块引用
菜鸟教程
学的不仅是技术更是梦想

Dorothy followed her through many of the beautiful rooms in her castle.

The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

嵌套引用

另外区块是可以嵌套的，一个 > 符号是最外层，两个 > 符号是第一层嵌套，以此类推：

最外层

第一层嵌套

第二层嵌套

Dorothy followed her through many of the beautiful rooms in her castle.

The Witch bade her clean the pots and kettles and sweep the floor and keep the fire fed with wood.

区块中使用列表

区块中使用列表

1. 第一项
2. 第二项

• 第一项
• 第二项
• 第三项

列表中使用区块

• 第一项

  菜鸟教程
  学的不仅是技术更是梦想

• 第二项

  菜鸟教程2
  学的不仅是技术更是梦想2

Markdown 代码

如果是段落上的一个函数或片段的代码可以用反引号把它包起来（`）
要将单词或短语表示为代码，请将其括在勾号（）中。 System.Console.WriteLine("HelloWorld!") System.Console.WriteLine("HelloWorld!")`

class Class1 { Public string Name {get; set;} }

At the command prompt, type nano.
At the command prompt, type nano.

转义刻度线

如果要表示为代码的单词或短语包含一个或多个刻度线，可以通过将单词或短语括在双刻度线（``）中来对其进行转义。

Use `code` in your Markdown file.

Use code in your Markdown file.

代码区块

可以用 ``` 包裹一段代码，并指定一种语言

$(document).ready(function () {
    alert('RUNOOB');
});

{
  "firstName": "John",
  "lastName": "Smith",
  "age": 25
}

Markdown 链接

这是一个链接 傻鸟教程
简书

百度

https://www.runoob.com

https://markdown.p2hp.com

fake@example.com

My favorite search engine is Duck Duck Go.

直接使用html的a连接
简书

自动网址链接

许多Markdown处理器会自动将URL转换为链接。这意味着如果您输入http://www.example.com，即使您没有使用方括号，您的Markdown处理器也会自动将其转换为链接。

http://www.example.com

禁用自动URL链接

如果您不希望自动链接URL，则可以通过将URL表示为带有刻度线的代码来删除该链接。

http://www.example.com

高级链接

I get 10 times more traffic from Google 1 than from
Yahoo 2 or MSN 3.

I get 10 times more traffic from Google than from
Yahoo or MSN.

Markdown 图片

网络图片

本地图片

Markdown 还没有办法指定图片的高度与宽度，如果你需要的话，你可以使用普通的 <img> 标签。

这个链接用 1 作为网址变量 傻鸟教程.
然后在文档的结尾为变量赋值（网址）

Markdown 表格

Markdown 制作表格使用 | 来分隔不同的单元格，使用 - 来分隔表头和其他行。

表头	表头	表头	表头
单元格	单元格	单元格	单元格
单元格	单元格	单元格	单元格
单元格	单元格	单元格	单元格
单元格	单元格	单元格	单元格

我们可以设置表格的对齐方式：

• -: 设置内容和标题栏居右对齐。
• :- 设置内容和标题栏居左对齐。
• :-: 设置内容和标题栏居中对齐

左对齐	右对齐	居中对齐
单元格	单元格	单元格
单元格	单元格	单元格

按键

使用 Ctrl+Alt+Del 重启电脑

转义

Markdown 使用了很多特殊符号来表示特定的意义，如果需要显示特定的符号则需要使用转义字符，Markdown 使用反斜杠转义特殊字符：
文本加粗
** 正常显示星号 **

反斜线
` 反引号
* 星号
_ 下划线
{} 花括号
[] 方括号
() 小括号
# 井字号
+ 加号
- 减号
. 英文句点
! 感叹号

特殊字符	描述	字符的代码
	空格符	 
<	小于号	&lt;
>	大于号	&gt;
&	和号	&amp;
￥	人民币	&yen;
©	版权	&copy;
®	注册商标	&reg;
°C	摄氏度	&deg;C
±	正负号	&plusmn;
×	乘号	&times;
÷	除号	&divide;
²	平方（上标²）	&sup2;
³	立方（上标³）	&sup3;

横向流程图源码格式：

graph LR A[方形] -->B(圆角) B --> C{条件a} C -->|a=1| D[结果2221] C -->|a=2| E[结果1112] F[横向流程图]

竖向流程图源码格式：

graph TD A[方形] --> B(圆角) B --> C{条件a} C --> |a=1| D[结果1] C --> |a=2| E[结果2] F[竖向流程图]

标准流程图源码格式：

st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op

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

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

UML时序图源码样例：

对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？

UML时序图源码复杂样例：

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: 没人陪我玩

UML标准时序图样例：

%% 时序图例子,-> 直线，-->虚线，->>实线箭头 sequenceDiagram participant 张三 participant 李四 张三->王五: 王五你好吗？ loop 健康检查 王五->王五: 与疾病战斗 end Note right of 王五: 合理 食物 <br/>看医生... 李四-->>张三: 很好! 王五->李四: 你怎么样? 李四-->王五: 很好!

甘特图样例：

%% 语法示例 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

基本图行

id + [文字描述] 矩形
id + (文字描述) 圆角矩形
id + > 文字描述] 不对称的矩形
id + {文字描述} 菱形
id + ((文字描述)) 圆形

graph TD id[带文本的矩形] id4(带文本的圆角矩形) id3>带文本的不对称的矩形] id1{带文本的菱形} id2((带文本的圆形))

节点之间的连接

A --> B A 带箭头指向 B
A --- B A 不带箭头指向 B
A -.- B A 用虚线指向 B
A -.-> B A 用带箭头的虚线指向 B
A ==> B A 用加粗的箭头指向 B
A -- 描述 --- B A 不带箭头指向 B 并在中间加上文字描述
A -- 描述 --> B A 带箭头指向 B 并在中间加上文字描述
A -. 描述 .-> B A 用带箭头的虚线指向 B 并在中间加上文字描述
A == 描述 ==> B A 用加粗的箭头指向 B 并在中间加上文字描述

graph LR A[A] --> B[B] A1[A] --- B1[B] A4[A] -.- B4[B] A5[A] -.-> B5[B] A7[A] ==> B7[B] A2[A] -- 描述 --- B2[B] A3[A] -- 描述 --> B3[B] A6[A] -. 描述 .-> B6[B] A8[A] == 描述 ==> B8[B]

子流程图

格式
subgraph title
graph definition
end

graph TB c1-->a2 subgraph one a1-->a2 end subgraph two b1-->b2 end subgraph three c1-->c2 end

自定义样式

语法：style id 具体样式

graph LR id1(Start)-->id2(Stop) style id1 fill:#f9f,stroke:#333,stroke-4px,fill-opacity:0.5 style id2 fill:#ccf,stroke:#f66,stroke-2px,stroke-dasharray: 10,5

demo

绘制一个流程图, 找出 A、 B、 C 三个数中最大的一个数。

graph LR start[开始] --> input[输入A,B,C] input --> conditionA{A是否大于B} conditionA -- YES --> conditionC{A是否大于C} conditionA -- NO --> conditionB{B是否大于C} conditionC -- YES --> printA[输出A] conditionC -- NO --> printC[输出C] conditionB -- YES --> printB[输出B] conditionB -- NO --> printC[输出C] printA --> stop[结束] printC --> stop printB --> stop

graph LR A[取得微信code请求登录]--> B{用户是否存在} B --> |是| C[登录] B --> |否| D[手机验证码] D --> |验证通过|C

7. 流程图

更多语法参考：流程图语法参考

示例

st=>start: Start:>https://www.zybuluo.com
io=>inputoutput: verification
op=>operation: Your Operation
cond=>condition: Yes or No?
sub=>subroutine: Your Subroutine
e=>end

st->io->op->cond
cond(yes)->e
cond(no)->sub->io

8. 序列图

更多语法参考：序列图语法参考

示例 1

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

示例 2

Title: Here is a title
A->B: Normal line
B-->C: Dashed line
C->>D: Open arrow
D-->>A: Dashed open arrow

9. 甘特图

甘特图内在思想简单。基本是一条线条图，横轴表示时间，纵轴表示活动（项目），线条表示在整个期间上计划和实际的活动完成情况。它直观地表明任务计划在什么时候进行，及实际进展与计划要求的对比。
更多语法参考：甘特图语法参考

    title 项目开发流程
    section 项目确定
        需求分析       :a1, 2016-06-22, 3d
        可行性报告     :after a1, 5d
        概念验证       : 5d
    section 项目实施
        概要设计      :2016-07-05  , 5d
        详细设计      :2016-07-08, 10d
        编码          :2016-07-15, 10d
        测试          :2016-07-22, 5d
    section 发布验收
        发布: 2d
        验收: 3d

10. Mermaid 流程图

    A[Hard edge] -->|Link text| B(Round edge)
    B --> C{Decision}
    C -->|One| D[Result one]
    C -->|Two| E[Result two]

11. Mermaid 序列图

更多语法参考：Mermaid 流程图语法参考

    Alice->John: Hello John, how are you?
    loop every minute
        John-->Alice: Great!
    end

更多语法参考：Mermaid 序列图语法参考

转载：【https://www.cnblogs.com/anovana/p/10362347.html】
1、进入你的博客：管理 > 选项，里面有个启用数学公式支持，选上后保存。这时，你就可以在你的博客里写数学公式了。
2、在公式开始和结尾输入美元符号： 如 美元符号x^2美元符号，则显示x的平方
3、需要在http://latex.codecogs.com/eqneditor/editor.php里面编辑好后复制源码过来。
代码实例： x=frac{{-b}pmsqrt{b^2-4ac}}{2a}（注意两边加上$符号括起来）
得到如下结果：

(x=frac{{-b}pmsqrt{b^2-4ac}}{2a})

$ J_alpha(x) = sum_{m=0}^infty frac{(-1)^m}{m! Gamma (m + alpha + 1)} {left({ frac{x}{2} } ight)}^{2m + alpha} ext {，行内公式示例} $

[ egin{matrix} 1 & x & x^2 \ 1 & y & y^2 \ 1 & z & z^2 \ end{matrix} ]

在Markdown中插入公式，一般为
(公式内容) 或者 $$公式内容$$
上下标
使用^来表示上标，_来表示下标，同时如果上下标的内容多于一个字符，可以使用{}来将这些内容括起来当做一个整体

[x = a_1^n + a_{23}^n + a_{4}^n ]

分数

[frac{1}{3} 与 cfrac{1}{3} ]

求和

[frac{d}{dx}e^{ax}=ae^{ax}quad sum_{i=1}^{n}{(X_i - overline{X})^2} ]

求导数

[frac{partial^2 u}{partial z^2} ]

积分

[int ^{10}_1 x^2 dx ]

连乘

[prod_{n=1}^{100}2^n ]

极限

[lim_{n ightarrow+infty} n^2 ]

开方

[sqrt[3]{X} 和 sqrt{1 - x} ]

三角函数

[ot quad angle quad sin(pi) quad cos quad an ]

对数函数

[ln15 quad log_210 quad lg7 ]

关系运算符

[+ - pm imes div sum prod eq leq geq ]

分段函数

[y=egin{cases} 0 & z<0 \ 0.5 & z=0 \ 1 & z>0 end{cases}]

矩阵

[egin{bmatrix} 1 & 2 & 3 \ 4 & 5 & 6 \ 7 & 8 & 9 end{bmatrix} ag{1} ]

[ egin{Bmatrix} 1 & 2 & 3 \ 4 & 5 & 6 \ 7 & 8 & 9 end{Bmatrix} ag{2} ]

[left[ egin{matrix} 1 & 2 & cdots & 4 \ 7 & 6 & cdots & 5 \ vdots & vdots & ddots & vdots \ 8 & 9 & cdots & 0 \ end{matrix} ight] ag{3} ]

[left[ egin{array}{cc|c} 1 & 2 & 3 \ 4 & 5 & 6 end{array} ight] ag{4} ]

这里是行间矩阵测试

(igl( egin{smallmatrix} l&l\j&z end{smallmatrix} igr))

这里是行间矩阵测试

数学公式仓靠参考链接

1. https://blog.csdn.net/yimingsilence/article/details/79269017
2. https://blog.csdn.net/zdk930519/article/details/54137476
3. https://www.cnblogs.com/jngwl/articles/10096017.html
4. https://www.cnblogs.com/cmt/p/3279312.html

---

1. MarkDown 语法示例 ↩︎