导图社区 Markdown语法教程
Markdown语法教程学习关键要点梳理,内容包括列表&引用、网页链接与图像、代码域、任务列表、拓展文本格式标记等等,一张图带你完全了解相关内容,帮你提高效率,赶紧来试一试吧~
编辑于2023-02-22 22:07:34 江苏省Markdown语法教程
标题&目录
标题
# × 标题级数 + 空格 + 文本内容
目录
在文档的顶部 输入 [toc]
斜体包含粗体
* + 斜体文本 + ** + 粗体文本 + ** + 斜体文本 + *
* + 斜体文本 + __ + 粗体文本 + __ + 斜体文本 + *
斜体&粗体
斜体
* + 文本内容 + *
粗体
** + 文本内容 + **
粗斜体
1. *** + 文本内容 + ***
粗体包含斜体
** + 粗体文本 + * + 斜体文本 + * + 粗体文本 + **
线
水平分割线
水平分割线由至少 3 个 * 或 - 组成
文本删除线
~~ + 文本内容 +~~
文本下划线
<u> + 文本内容 + </u>
列表&引用
有序列表
1. + 空格 + 文本内容
无序列表
- + 空格 + 文本内容
引用
> + 文本内容
缩进&退格
缩进
Tab
Ctrl + [
引用的 缩进 和列表 不同
引用需另起一行,并额外多打一个 > 来完成 缩进
退格
Shift + Tab
Ctrl + ]
网页链接与图像
网页链接
[ + 显示文本内容 + ] + ( + 链接地址 + 空格 + " + 提示信息文本 + " + )
图像
!+[ + 显示文本内容 + ] + ( + 链接地址 + 空格 + " + 提示信息文本 + " + )
表格
格式
|(Shift+\)是构成表格的主要 框架
- 区分 表头 和 表格主体
: 控制 表格内 文本内容 的 对齐方式
|:-|:-:|-:| 区分表头和表格主体,:代表文本对齐方式,分别是左对齐,居中对齐,右对齐
Typora编辑器中 输入 Ctrl + T 即可快速插入表格,自由定义样式
表格中文本内容的换行
若想对一段长文本进行换行,可以在 中间 插入一个 <br> ( 换行标签 )
代码域
行内代码
输入两个 ` 反引号 ,在中间写代码内容
行内代码不一定非得写代码,也可以作为着重标记,突出显示内容
行内代码中,源代码界面和渲染界面是完全一致的,标识符会失效
所谓行内代码: 只要你的屏幕足够宽,它就不会换行
代码块
格式
在首行和末行各加 三个 ` 反引号
在首行和末行各加 三个 ~ 波浪号
Typora编辑器中 输入 Ctrl + Shift+K 即可快速插入代码块
在代码块也不一定要写代码,可以写一段突出的文本内容,语言类型可以填写 txt 或者 干脆不写
代码块中,源代码界面和渲染界面是完全一致的,标识符会失效
在 Typora编辑器 ,用键盘按键脱离代码块区域,需输入: Ctrl + Enter
任务列表
- + 空格 +[ ] +空格 + 任务列表内容 ( 中括号[ ] 里面必须有个空格)
给待办任务列表打 √ ,变成 已办
在源代码界面,在中括号内输入 英文字母x
注释
<!-- 这里是注释的内容 -->
变量
网页链接变量
首先输入 [显示文本内容] + [变量名]
然后在文档任意一个区域,输入: [变量名] + : + 空格 + 链接地址
脚注
首先在需要脚注的地方,输入: [^脚注代号] ( 脚注代号会直接显示在渲染界面 )
然后在其他区域,输入: [^脚注代号] + : + 空格 + 脚注内容
拓展文本格式标记
放大文本
<big>+文本内容+</big>
放大粗体文本
**+<big>+文本内容+</big>+**
<big>+**+文本内容+**+</big>
缩小文本
<small>+文本内容+</small>
缩小斜体文本
<small>+*+文本内容+*+</small>
*+<small>+文本内容+</small>+*
多彩文本
<font color=orange>+文本内容+</font>
只需要在上面示例的基础上,加上加粗/斜体标识符
多彩文本尽量慎用,Markdown 的核心就是 简洁精炼,注重 实质内容,而非花哨的 颜色样式
拓展文本显示效果
文本高亮
==+文本内容+==
上标
用一对 ^ 包裹
x^2^
下标
用一对 ~ 包裹
H~2~O
Emoji 符号
用一对 : 包裹
Typora编辑器 中,输入 : 就会带提示器
转义字符
在 Markdown 中,我们 通过 标识符 改变 文本显示效果
希望它不作为标识符,而是 作为字符本身呈现出来
可以用代码域 ,因为代码模式的显示效果就是源代码完全一致的
可以利用转义字符,在这些标识符 前面 加上 反斜线 \
空格
在一些编辑器或者支持MD的笔记软件里,无论你打多少个空格,它只会显示单个 空格 的距离
可以使用 HTML中 空格 的 字符实体  
若要添加 多个 空格,就输入多个
换行
在一些编辑器或者支持MD的笔记软件里,无论你打多少个 回车,它只会显示单个 回车 的空行间距
可以使用之前表格里提到的 <br> 标签,在 单独一行 中使用,增加额外的空行间距
如果要增加 多个,就输入 多个 <br><br><br><br><br>
强制删除
Shift + Backspace
嵌入
嵌入音频
<audio controls="controls" preload="none" src="音频链接地址"></audio>
嵌入视频
<video width="600" height="420" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> <source src="movie.webm" type="video/webm"> </video>
width ( 宽度 ) height ( 高度 ) ,可以自己设置,直接输入数字即可,单位默认是 px(像素) 也可以使用 百分比 width=100% 代表水平撑满整个窗口 height=50% 代表垂直撑满半个窗口
Video标签 支持的视频格式 :MP4 ogg webm
嵌入页面
网页
<iframe width=600 height=400 src="页面链接地址" scrolling="auto" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
在线视频
<iframe width=600 height=400 src="视频地址" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
Latex 数学公式
行内公式
$ + 行内公式 + $
公式块
$$ 公式块 $$
Mermaid
流程图
```mermaid graph TB %% s=start e=end f=fork n=normal s([开始])-->f1{{if条件}}; %% 分支点2 f1--true-->n1[if语句块]-->e([结束]); f1--false-->f2{{else if条件}}; %% 分支点1 f2--true-->n2[else if语句块]-->e; f2--false-->n3[else语句块]-->e; ```
```mermaid graph LR %% s=start e=end f= fork n=normal %% 虚线 s[朱百六]-.->|子|n1[朱四九]-.->|子|n2[朱五四]-.->|子|f1_帝((朱八八)) %% 分支点 朱八八 f1_帝-->|长子|f2[朱标] f1_帝-->|次子|n3[朱樉] f1_帝-->|三子|n4[朱棢] f1_帝-->|四子|n5_帝((朱棣)) %% 分支点 朱标 f2-->|长子|e1[朱雄英] f2-->|次子|e2_帝((朱允炆)) n5_帝-->|长子|e3[朱高炽] ```
饼图
```mermaid pie title 为什么总是宅在家里? "喜欢宅" : 45 "天气太热" : 70 "穷" : 500 "关你屁事" : 95 ```
序列图 (时序图)
```mermaid sequenceDiagram %% 自动编号 autonumber %% 定义参与者并取别名,aliases:别名 participant A as Aly participant B as Bob participant C as CofCai %% 便签说明 Note left of A: 只复习了一部分 Note right of B: 没复习 Note over A,B: are contacting A->>B: 明天是要考试吗? B-->>A: 好像是的! %% 显示并行发生的动作,parallel:平行 %% par [action1] rect rgb(0, 25, 155) par askA C -->> A:你复习好了吗? and askB C -->> B:你复习好了吗? and self C ->>C:我还没准备复习...... end end %% 背景高亮,提供一个有颜色的背景矩形 rect rgb(25, 55, 0) loop 自问/Every min %% <br/>可以换行 C ->> C:我什么时候<br/>开始复习呢? end end %% 可选择路径 rect rgb(153, 83, 60) alt is good A ->> C:复习了一点 else is common B ->> C:我也是 end %% 没有else时可以提供默认的opt opt Extra response C ->> C:你们怎么不回答我 end endsequenceDiagram %% 自动编号 autonumber %% 定义参与者并取别名,aliases:别名 participant A as Aly participant B as Bob participant C as CofCai %% 便签说明 Note left of A: 只复习了一部分 Note right of B: 没复习 Note over A,B: are contacting A->>B: 明天是要考试吗? B-->>A: 好像是的! %% 显示并行发生的动作,parallel:平行 %% par [action1] rect rgb(0, 25, 155) par askA C -->> A:你复习好了吗? and askB C -->> B:你复习好了吗? and self C ->>C:我还没准备复习...... end end %% 背景高亮,提供一个有颜色的背景矩形 rect rgb(25, 55, 0) loop 自问/Every min %% <br/>可以换行 C ->> C:我什么时候<br/>开始复习呢? end end %% 可选择路径 rect rgb(153, 83, 60) alt is good A ->> C:复习了一点 else is common B ->> C:我也是 end %% 没有else时可以提供默认的opt opt Extra response C ->> C:你们怎么不回答我 end end ```
甘特图
```mermaid gantt title A Gantt Diagram dateFormat YYYY-MM-DD section Section A task :a1, 2014-01-01, 30d Another task :after a1 , 20d section Another Task in sec :2014-01-12 , 12d another task : 24d ```
类图
```mermaid classDiagram Animal <|-- Duck Animal <|-- Fish Animal <|-- Zebra Animal : +int age Animal : +String gender Animal: +isMammal() Animal: +mate() class Duck{ +String beakColor +swim() +quack() } class Fish{ -int sizeInFeet -canEat() } class Zebra{ +bool is_wild +run() } ```
标签 (Tag)
标签是 Obsidian 特有的一个功能,标签可以通过点击唤起快速搜索 (搜索包含该标签的所有笔记)
# + 标签名
避免标识符的滥用
一篇笔记里的某段文本,使用各式各样的的标识符,会造成重点不清晰 有三种标识,慎用
词中对单个汉字的标识
短语中对单个英语单词的标识
标识符的多层嵌套
词义的割裂 视觉的混乱 不利于搜索