Markdown 语法学习，语法查询，快捷键

目录

标题

列表

段落 字体

区块

代码段

图片

表格

html

1 改变字体颜色大小

2 对齐方式

3 插入图像

扩展用法

1 插入emoji表情

2 插入目录

3 流程图

4 快捷键

5 数学公式

6 超链接

markdown - nice

标题

#+ ：代表标题 几个#代表几级标题

列表

-：表示列表 总动补全列表

数字+.+ :有序列表

按下Tab进入次级列表

段落 字体

<span style="background-color:#f8f8f8"><span style="color:#333333">*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___</span></span>

<span style="background-color:#f8f8f8"><span style="color:#333333">分割线:
***
* * *
*****
---
- - -
----------</span></span>

<span style="background-color:#f8f8f8"><span style="color:#333333">删除线：
~~删除内容~~</span></span>

删除内容

<span style="background-color:#f8f8f8"><span style="color:#333333">下划线
<u>带下划线文本</u></span></span>

区块

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

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

<span style="background-color:#f8f8f8"><span style="color:#333333">> 最外层
> > 第一层嵌套
> > > 第二层嵌套</span></span>

最外层

第一层嵌套

第二层嵌套

代码段

代码段

单行代码段：使用一对`括起来

代码段

多行代码段：使用三个 ` 加Enter/空格+编程语言

<span style="background-color:#f8f8f8"><span style="color:#333333">​
​</span></span>

图片

• 开头一个感叹号 !

• 接着一个方括号，里面放上图片的替代文字

• 接着一个普通括号，里面放上图片的网址，最后还可以用引号包住并加上选择性的 'title' 属性的文字。

<span style="background-color:#f8f8f8"><span style="color:#333333">![alt 属性文本](图片地址) 
​
![alt 属性文本](图片地址 "可选标题")
​
![本地png图片PictureTest.png](./img/PictureTest.png)
​
![本地jpg图片](./img/PictureTest.jpg)
​
![网络图片](http://static.runoob.com/images/runoob-logo.png "菜鸟教程")</span></span>

表格

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

<span style="background-color:#f8f8f8"><span style="color:#333333">|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |</span></span>

• :-表示左对齐

• -:表示右对齐

• :-:表示中间对齐

html

1 改变字体颜色大小

我们可以使用<font> </font>标签来改变字体的颜色及大小，如：

字体颜色为红色，大小为3

字体颜色为蓝色，大小为4

字体颜色为紫罗兰，大小为6

2 对齐方式

我们可以改变字体的对齐方式，用标签<p> </p>加上属性align，如：

3 插入图像

因为CSDN不支持使用img标签修改图像，所以下面的结果都不是准确的。大家可以自己在Typora中测试。 我们可以通过标签<img src=url />来插入图片，如：

<img src="img/1.jpg" />

我们可以改变<img>标签的属性，来改变图片的大小。

<span style="background-color:#f8f8f8"><span style="color:#333333"><img src="img/1.jpg" width=100 height=100/></span></span>

扩展用法

1 插入emoji表情

我们可以使用:emoji:的语法来插入表情，比如：

😄

🦀

🐴

2 插入目录

当我们为使用标题将文分章节后，可以在输入[toc]命令的地方自动根据标题生成目录。

3 流程图

Typora支持三类流程图：

• sequence

• flowchart

• gantt

我们依次介绍。首先，只需要敲入以下代码，然后选择语言为sequence即可生成下面的图

对于Flowchart，可以使用下面的code，然后语法选择flow

Mermaid是另一个流程图生成的引擎，在官网中它是这么介绍自己的

除了Sequence和Flowchart两类图之外，Mermaid还提供一种叫做gantt的图。插入下面的代码，然后语法选mermaid就会自动渲染成gantt图了。

4 快捷键

ctrl+b：自动加粗

ctrl+i：自动倾斜

ctrl+t： 插入表格

5 数学公式

在Typora中，有两种方法插入数学公式，语法为：

第一种方法：$数学公式$ 第二种方法： $$ 数学公式 $$

第一种方法表示插入行内公式（内联公式），即可以将公式插入到一行中，比如1 + 2 = 3 这样的公式。

第二种方法表示插入行间公式（外联公式），即可以将公式插入到行与行之间，单独占据一行或者数行的空间，并且居中放置。

<span style="background-color:#f8f8f8"><span style="color:#333333">我们可以使用`\sqrt{}`来表示根号。如：
​
\sqrt{2},\sqrt{5}</span></span>

6 超链接

<span style="background-color:#f8f8f8"><span style="color:#333333">[链接名称](链接地址)
<链接地址></span></span>

markdown - nice