适合Obsidian的Markdown教程

Updated: at 09:12 AMSuggest Changes

什么是 Markdown?

  1. Markdown 是一款轻量级标记语言，不同于 HTML (Hypertext Markup Language)，Markdown 的语法非常简单，且容易上手
  2. Markdown 以 纯文本格式 编写文档，依赖键盘而非鼠标，专注于写作本身，感受书写的魅力
  3. Markdown 的通过添加一些简单的 标识符，让文本具有恰到好处的格式
  4. Markdown 核心特征就是 删繁剪芜， 简扼 + 精炼
  5. Markdown 是 笔记 与 网页文章 的最佳载体
  6. Down 的核心：坐 下 来，就能把思维写 下 来
    • 牛津高阶英汉双解词典第九版 中，关于 down 的释义：

为什么要使用 Markdown?

有朋友问我 ，Markdown 的效果 用 Word 完全可以复现，甚至功能更多，那为何要用 Markdown 呢？

答：

MD 的优势：

  1. Markdown 让我们免于 被繁杂臃肿的功能晃花了眼 的困扰
  2. Markdown 让我们回归内容本身，拥抱笔记的内核，而非浮于表象的样式，写出高效精练的笔记！

用 Markdown 写东西，记住一个原则

能用 10 个字搞定的，绝不用 11 个字

经常使用 Markdown 书写的朋友，也许会有一种奇妙的感触

关于标识符的滥用

这个其实是写在最后的，之所以放在这里，是因为它很重要！

如果你有一定的 MD 语法基础，可以直接 [[#19 避免标识符的滥用|点击跳转]]

Markdown 相关软件推荐

Markdown 语法

1. 标题&目录

1.1 标题

这是一段普通的文本

# 这是一级标题
## 这是二级标题
### 这是三级标题
#### 这是四级标题
##### 这是五级标题
###### 这是六级标题

1.2 目录

输入下方内容会生成一个目录：

[toc]

2. 斜体&粗体

2.1 斜体

这是一段普通文本

*这里是一段斜体文本*
_这也是一段斜体文本_

示范

这是一段普通文本

这里是一段斜体文本

这也是一段斜体文本

2.2 粗体

这是一段普通文本

**这里是一段加粗文本**
__这也是一段加粗文本__

示范

这是一段普通文本

这里是一段加粗文本

这也是一段加粗文本

2.3 粗斜体 (斜粗体)

这是一段普通文本

***粗斜体文本1***
___粗斜体文本2___
**_粗斜体文本3_**
__*粗斜体文本4*__
*__粗斜体文本5__*
_**粗斜体文本6**_

示范

这是一段普通文本

粗斜体文本 1

粗斜体文本 2

粗斜体文本 3

粗斜体文本 4

粗斜体文本 5

粗斜体文本 6

2.4 斜体包含粗体

这是一段普通文本

*这里是一段斜体中**包含粗体**的文字*
_这也是一段斜体中**包含粗体**的文字_
*这又是一段斜体中__包含粗体__的文字*
_这还是一段斜体中**包含粗体**的文字_

示范

这是一段普通文本

这里是一段斜体中包含粗体的文字

这也是一段斜体中包含粗体的文字

这又是一段斜体中 __ 包含粗体 __ 的文字

这还是一段斜体中包含粗体的文字

2.5 粗体包含斜体

这是一段普通文本

**这里是一段粗体中*包含斜体*的文字**
__这也是一段粗体中_包含斜体_的文字__
**这又是一段粗体中_包含斜体_的文字**
__这还是一段粗体中*包含斜体*的文字__

示范

这是一段普通文本

这里是一段粗体中 * 包含斜体 * 的文字

这也是一段粗体中 _ 包含斜体 _ 的文字

这又是一段粗体中 _ 包含斜体 _ 的文字

这还是一段粗体中 * 包含斜体 * 的文字

3. 线

3.1 水平分割线

下面是一条水平分割线：
---
***

示范

3.2 文本删除线

~~这是一段加了删除线的文本~~

示范

这是一段加了删除线的文本

3.3 文本下划线

<u>这是一段加了下划线的文本</u>

示范

这是一段加了下划线的文本

4. 列表&引用

4.1 有序列表

1. 这是第一个有序列表 <!-- (Enter) -->
2. 这是第二个有序列表 <!-- (Enter) -->
3. 这是第三个有序列表 


1. 这是第一个有序列表 <!-- (Shift + Enter) -->
   这是同个列表下，另起一行的文本内容 <!-- (Enter) -->
2. 这是第二个有序列表 <!-- (Shift + Enter) -->
   这是同个列表下，另起一行的文本内容

示范

  1. 这是第一个有序列表
  2. 这是第二个有序列表
  3. 这是第三个有序列表
  4. 这是第一个有序列表 这是同个列表下，另起一行的文本内容
  5. 这是第二个有序列表 这是同个列表下，另起一行的文本内容

补充

- 10.这是无序列表下，整十数排列的内容
- 20.这是无序列表下，整十数排列的内容
- 30.这是无序列表下，整十数排列的内容


- 100.这是无序列表下，整百数排列的内容
- 200.这是无序列表下，整百数排列的内容
- 300.这是无序列表下，整百数排列的内容

效果：

4.2 无序列表

- 这是第1个无序列表 <!-- (Enter) -->
- 这是第2个无序列表 <!-- (Enter) -->
- 这是第3个无序列表

- 这是第一个无序列表 <!-- (Shift + Enter) -->
  这是同个列表下，另起一行的文本内容
- 这是第二个无序列表 <!-- (Shift + Enter) -->
  这是同个列表下，另起一行的文本内容

示范

列表可在 OB 中，设置快捷键，在 批量处理与取消上 会更方便

4.3 引用

> 这是第一段引用文本的第1行 <!-- (Enter) -->
> 这是第一段引用文本的第2行 <!-- (Enter) -->
<!-- (Enter) -->
> 这是第二段引用文本的第1行 <!-- (Enter) -->
> 这是第二段引用文本内第2行

注： 后面的 > 敲 回车 会自动补上

示范

这是第一段引用文本的第 1 行 这是第一段引用文本的第 2 行

这是第二段引用文本的第 1 行 这是第二段引用文本的第 2 行

4.4 缩进&退格

在列表和引用的书写过程中，我们需要利用 ==缩进== 与 ==退格== ，让文章肌理分明，更具层级

4.4.1 有序列表的缩&退

1. 第一级有序列表1 <!-- (Enter) -->
	1. 第二级有序列表1    <!-- 写文本之前，先( Tab 或 Ctrl + ] ) ；写完文本后，再(Enter) -->
	2. 第二级有序列表2 <!-- (Enter) -->
2. 第一级有序列表2    <!-- 写文本前，先 ( Shift + Tab 或 Ctrl + [ ) -->
示范
  1. 第一级有序列表 1
    1. 第二级有序列表 1
    2. 第二级有序列表 2
  2. 第一级有序列表 2

4.4.2 无序列表的缩&退

- 第一级无序列表1 <!-- (Enter) -->
	- 第二级无序列表1  <!-- 写文本前，先( Tab 或 Ctrl + ] ) ；写完后，再(Enter) -->
	- 第二级无序列表2 <!-- (Enter) -->
- 第一级无序列表2  <!-- 写文本前，先 ( Shift + Tab 或 Ctrl + [ ) -->
示范

4.4.3 引用的缩&退

源码
> 这是第一级引用
> > 这是第二级引用 <!-- 这里手动加一个 > ，打完后，敲 2 下回车键 -->
> 
> 这里又是第一级引用了
示范

这是第一级引用

这是第二级引用

这里又是第一级引用了

4.4.4 有序&无序&引用 连续套娃

1. 第一级 有序列表1 <!-- (Shift + Enter) --> 
	- 第二级 无序列表1 <!-- (Shift + Enter) -->
		>第三级 引用1  <!-- (Enter) -->
			- 第四级 无序列表2 <!-- (Shift + Enter) -->
            	1. 第五级 有序列表2 <!-- (Enter) -->
            - 第四级 无序列表3   <!-- 写文本前，先( Shift + Tab 或 Ctrl + [ ) ；写完后再 (Enter) -->
        >第三级 引用2  <!-- 写文本前，先( Shift + Tab 或 Ctrl + [ ) ；写完后再 (Enter × 2) -->
    - 第二级 无序列表4  <!-- 写文本前，先( Shift + Tab 或 Ctrl + [ ) -->
2. 第一级 有序列表3  <!-- 写文本前，先( Shift + Tab 或 Ctrl + [ ) -->
示范

  1. 第一级 有序列表 1

    • 第二级 无序列表 1

      第三级 引用 1

      • 第四级 无序列表 2
      1. 第五级 有序列表 2
      • 第四级 无序列表 3

      第三级 引用 2

    • 第二级 无序列表 4

  2. 第一级 有序列表 3

4.4.5 Obsidian 的一些缩退问题

- - 这是第一段就被缩进的列表
	- 这是第二段被再次缩进的列表  <!-- 这里需按两次 Ctrl + ] ,Tab键是无效的 -->
  - 这是第三段列表  <!-- Ctrl + [ -->

5. 网页链接与图像

5.1 网页链接

[显示文本内容](链接地址 "提示信息文本")

[百度一下，你就知道](http://www.baidu.com "按住Ctrl点击跳转百度")

示范：

百度一下，你就知道

5.1.1 链接的加粗

5.2 图像

![文字信息](图片链接 "提示文本信息")	

![湘湖1](https://z3.ax1x.com/2021/08/06/fuNkXq.jpg "湘湖一角")

示范

湘湖1|400x400

6. 表格

|这里是表头1|这里是表头2|这里是表头3|
|:-|:-:|-:|    <!--区分表头和表格主体，:代表文本对齐方式，分别是左对齐，居中对齐，右对齐-->
|单元格数据1|单元格数据2|单元格数据3|
|单元格数据4|单元格数据5|单元格数据6|

示范

这里是表头 1这里是表头 2这里是表头 3
单元格数据 1单元格数据 2单元格数据 3
单元格数据 4单元格数据 5单元格数据 6

6.1 表格中文本内容的换行

如下图所示：

表头 1表头 2
这是一段很长很长很长很长很长很长很长很长很长很长很长很长很长很长的文本普通文本
| 表头1 |  表头2 |
|:-:|:-:|
|这是第一行文本这是另起一行的文本|普通文本|

示范

表头 1表头 2
这是第一行文本这是另起一行的文本普通文本

7. 代码域

7.1 行内代码

`这是一段行内代码`

`<table border="1" cellspacing="0" width="500" height="500">`

`print("Hello, World!")`

`这是一行突出显示的文本内容`

示范

<table border="1" cellspacing="0" width="500" height="500">

print("Hello, World!")

这是一行突出显示的文本内容

7.2 代码块

```语言种类
代码内容
代码内容
代码内容
```

下面是HTML代码块

```html
<table border="1">
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>
```

下面是CSS代码块

```css
.box {
	width: 600px;
	height: 400px;
	margin: 100px auto;
	background-image: linear-gradient(black 33.3%,red 33.3%, red 66.6%, yellow 66.6%, yellow);
}	
```

下面是JavaScript代码块

```js
    // 定义一个30个整数的数组，按顺序分别赋予从2开始的偶数；然后按顺序每五个数求出一个平均值，放在另一个数组中并输出。试编程
    let arr = [2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60]
    let newarr = [];
    for (let i = 0, count = 0, sum = 0, len = arr.length; i < len; i++) {
        sum += arr.shift();
        count++;
        if (count % 5 === 0) {
            newarr.push(sum / 5);
            sum =  0;
        }
    }
    console.log(newarr);

    let arr = [2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60]
    let newarr = [];
    for (let i = 0, len = arr.length; i < len / 5; i++) {
        let subarr = arr.splice(0, 5)
        for (let j = 0, sum = 0; j < subarr.length; j++) {
            sum += subarr[j];
        }
        newarr.push(sum / 5);
    }
    console.log(newarr);
```


下面是Python代码块

```python
#!/usr/bin/python
# -*- coding: UTF-8 -*-

i = 2
while(i < 100):
   j = 2
   while(j <= (i/j)):
      if not(i%j): break
      j = j + 1
   if (j > i/j) : print i, " 是素数"
   i = i + 1
 
print "Good bye!"
```

下面是一块突出显示的文本

```txt
这是一段
突出显示的
文本内容
```

示范

<table border="1">
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

.box {
	width: 600px;
	height: 400px;
	margin: 100px auto;
	background-image: linear-gradient(black 33.3%, red 33.3%, red 66.6%, yellow 66.6%, yellow);
}	

// 定义一个30个整数的数组，按顺序分别赋予从2开始的偶数；然后按顺序每五个数求出一个平均值，放在另一个数组中并输出。试编程
let arr = [2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60]
let newarr = [];
for (let i = 0, count = 0, sum = 0, len = arr.length; i < len; i++) {
	sum += arr.shift();
	count++;
	if (count % 5 === 0) {
		newarr.push(sum / 5);
		sum =  0;
	}
}
console.log(newarr);

let arr = [2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60]
let newarr = [];
for (let i = 0, len = arr.length; i < len / 5; i++) {
	let subarr = arr.splice(0, 5)
	for (let j = 0, sum = 0; j < subarr.length; j++) {
		sum += subarr[j];
	}
	newarr.push(sum / 5);
}
console.log(newarr);

#!/usr/bin/python
# -*- coding: UTF-8 -*-

i = 2
while(i < 100):
   j = 2
   while(j <= (i/j)):
      if not(i%j): break
      j = j + 1
   if (j > i/j) : print i, " 是素数"
   i = i + 1
 
print "Good bye!"

这是一段
突出显示的
文本内容

7.2.1 代码块的嵌套

格式：

示范
````txt
```js
// 3. 输出 100以内(不包括100) 所有偶数的和
// 这类求和问题的核心 ： 利用循环  (总和 = 旧数的和 + 新数)

let sum = 0;

for (let i = 1, sum = 0; i < 100; i++) {
 if (i % 2 == 0) {
 // 筛选偶数
 sum += i; // sum = sum + i // 累加偶数并赋值给sum
 // sum为(旧的，已经进入循环的数)的和，i 为新进入循环的数。当加到(最后一个新数i)时，sum就是最后的 总和
 }
}

console.log(sum); // 打印总和
```
````

如果要再套一层，就在最外层 加 5个 ` ，以此类推……

7.3 如何在行内代码里显示反引号

首尾各用 两个反引号 `+ 空格 包裹

格式：

``+空格+带`的内容+空格+``  <!-- 不要忘记前后的两个空格 -->

`` 这是一段能显示`反引号`的行内代码 ``

效果：

这是一段能显示`反引号`的行内代码

8. 任务列表（待办）

- [ ] 待办任务列表1
- [ ] 待办任务列表2
- [x] 已办任务列表1    <!-- 英文字母X -->
- [x] 已办任务列表2

示范

示范

9. 注释

Markdown 的 注释 和 HMTL 一样，注释的内容在 渲染界面 不可见 （部分编辑器可见)

<!-- 这里是一行注释 -->

<!--
这里是
一段
假装有
很多行的
注释
-->

%%这是一行Obsidian里的注释%%

%%
这里是
一段
假装有
很多行的
Obsidian里的
注释
%%

示范 (只有切换至 编辑模式 才能看到喔)

%% 这是一行 Obsidian 里的注释%%

%% 这里是 一段 假装有 很多行的 Obsidian 里的 注释 %%

10. 变量

10.1 网页链接变量

[百度一下，你就知道][度娘]
[知乎-有问题，就会有答案][知乎]

<!-- 这里是变量区域 -->
[度娘]: http://www.baidu.com 
[知乎]: https://www.zhihu.com

示范

百度一下，你就知道

知乎 - 有问题，就会有答案

10.2 脚注

鲁迅原名是什么[^1] ，浙江哪里人[^2]

<!-- 这里是变量区域 -->
[^1]: 周树人
[^2]: 绍兴人

示范

鲁迅原名是什么 1，浙江哪里人 2

11. 拓展文本格式标记

11.1 键盘文本

11.1.1 加粗键盘文本

11.2 放大文本

11.2.1 放大粗体文本

11.3 缩小文本

11.3.1 缩小斜体文本

11.4 多彩文本

11.4.1 多彩粗体文本

11.4.2 多彩斜体文本

  1. 格式 1： *<font color=teal>This is an italic teal text</font>*
    • 效果： This is an italic teal text
  2. 格式 2： <font color=teal>*This is an italic teal text*</font>
    • 效果： This is an italic teal text

11.4.2 多彩粗斜体文本

  1. 格式 1： ***<font color=teal>This is a bold italic teal text</font>***
    • 效果： This is a bold italic teal text
  2. 格式 2： <font color=teal>***This is a bold italic teal text***</font>
    • 效果： This is a bold italic teal text

#注意 多彩文本尽量慎用，Markdown 的核心就是 简洁精炼，注重 实质内容，而非花哨的 颜色样式

12. 拓展文本显示效果

12.1 文本高亮

12.2 上标

12.3 下标

12.4 Emoji 符号

用一对 : 包裹，里面是 Emoji 符号的 语义化文本 ( Typora 编辑器 中，输入 : 就会带提示器 )

13. 转义字符

例 1 以普通字符显示星号

例 2 表格内 单元格中的竖杠

|表头1|表头2|
|-|-|
|这里的文本被\|分隔|这里的文本也被\|分隔|
表头 1表头 2
这里的文本被|分隔这里的文本也被|分隔

#补充 该技巧可用于 Obsidian 表格内 双链的文本修饰

文本修饰：

在 双链 [[ ]] 内 以 | 引导的内容

表格内的格式：

在 | 前面加上 \

示例：

|                  表头1                  |                        表头2                        |
|:---------------------------------------:|:---------------------------------------------------:|
| [[#例2 表格内 单元格中的竖杠\|单元格中的竖杠]] | [[#例3 不会变成代码的反引号\|不会变成代码的反引号]] |

效果：

表头 1表头 2
[[#例2 表格内 单元格中的竖杠|单元格中的竖杠]][[#例3 不会变成代码的反引号|不会变成代码的反引号]]

例 3 不会变成代码的反引号

使用 转义符号 \ 让 反引号 ` 变成普通字符，不再具有 [[#7 1 行内代码|行内代码]] 的标识符功能

格式：

\`这段被反引号包裹的内容不会变成行内代码\`

效果：

`这段被反引号包裹的内容不会变成行内代码`

例 4 链接中的中括号

在 网页链接 的 显示文本内容 中，使用 中括号 [ ]

例 5 不是列表的连接符 (横杠)

如下所示：

The Web, the Tree, and the String. 写作之难，在于把网状的思考，用树状结构，体现在线性展开的语句里。

  • 史蒂芬·平克

The Web, the Tree, and the String. 写作之难，在于把网状的思考，用树状结构，体现在线性展开的语句里。 - 史蒂芬·平克

例 6 不是标题的 #

让 # 不被识别为标题标识符

格式：

\# 这里的内容不会被识别为标题

效果：

# 这里的内容不会被识别为标题

例 7 不会注释的 %

在 Obsidian 中 注释是前后各两个 % 号

使用 转义符号 \，让 %% 作为普通字符显示出来，不具备注释的功能

例 8 木有链接的双链

Obsidian 的双向链格式是 2 个方括号 [[ ]] (双方)，使用 转义符号 \，让 [ ] 不再具有 双链功能

格式：

\[\[这段文本被双方包裹，但不是一个双向链\]\]

效果：

[[这段文本被双方包裹，但不是一个双向链]]

例 9 页链接里 显示文本内的 中括号

使用转义符号 \，让 中括号 可以作为 显示文本 在 [[#5 1 网页链接|网页链接]] 中显示出来

格式：

[\[这是一个带中括号的网页链接显示文本，点击会跳转至百度\]](https://www.baidu.com/)

效果：

[这是一个带中括号的网页链接显示文本，点击会跳转至百度]

特殊情况 文本修饰的中括号

文本修饰的 中括号 [ ] 不需要使用 转义符号 \

示范：

[[#例8 木有链接的双链|[这是一个带中括号的文本修饰]]]

效果：

[[#例 8 木有链接的双链|[这是一个带中括号的文本修饰]]]

14. 空格&换行&强制删除

14.1 空格

14.2 换行

场景 1：

格式：

这里是第一段文本

     <!-- 这里插入了5个空行间距 -->

这里是第二段文本

效果：

这里是第一段文本

这里是第二段文本

场景 2：

- 这是一段无序列表
       <!-- 插入一个空行间距，需单独一行，上下不用预留空格 -->
  这是同一段无序列表中，空一行距离显示的内容
- 这是第二段无序列表

效果：

14.3 强制删除

15. 嵌入

15.1 嵌入音频

<audio controls="controls" preload="none" src="https://www.ldoceonline.com/media/english/exaProns/p008-001803372.mp3?version=1.2.37"></audio>

15.2 嵌入视频

<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>

15.3 嵌入页面

<iframe width=600 height=400 src="https://www.runoob.com/html/html-tutorial.html" scrolling="auto" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

<iframe width=600 height=400 src="http://player.bilibili.com/player.html?aid=915396535&bvid=BV1Mu4y1v7FG&cid=1252667599&p=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

16. Latex 数学公式

16.1 行内公式

16.2 公式块

% 化学公式
$$
\ce{Zn^2+  <=>[+ 2OH-][+ 2H+]  $\underset{\text{amphoteres Hydroxid}}{\ce{Zn(OH)2 v}}$  <=>[+ 2OH-][+ 2H+]  $\underset{\text{Hydroxozikat}}{\ce{[Zn(OH)4]^2-}}$}
$$

% 麦克斯韦方程组
$$
\begin{array}{lll}
\nabla\times E &=& -\;\frac{\partial{B}}{\partial{t}}   
\ \nabla\times H &=& \frac{\partial{D}}{\partial{t}}+J   
\ \nabla\cdot D &=& \rho
\ \nabla\cdot B &=& 0
\ \end{array}
$$

% 薛定谔方程
$$
i\hbar\frac{\partial \psi}{\partial t} = \frac{-\hbar^2}{2m} \left(\frac{\partial^2}{\partial x^2} + \frac{\partial^2}{\partial y^2}+\frac{\partial^2}{\partial z^2} \right) \psi + V \psi
$$

$$ % 化学公式 \ce{Zn^2+ <=>[+ 2OH-][+ 2H+] $\underset{\text{amphoteres Hydroxid}}{\ce{Zn(OH)2 v}}$ <=>[+ 2OH-][+ 2H+] $\underset{\text{Hydroxozikat}}{\ce{[Zn(OH)4]^2-}}$} $$

$$ % 麦克斯韦方程组 \begin{array}{lll} \nabla\times E &=& -;\frac{\partial{B}}{\partial{t}}
\ \nabla\times H &=& \frac{\partial{D}}{\partial{t}}+J
\ \nabla\cdot D &=& \rho \ \nabla\cdot B &=& 0 \ \end{array} $$

$$ i\hbar\frac{\partial \psi}{\partial t} = \frac{-\hbar^2}{2m} \left(\frac{\partial^2}{\partial x^2} + \frac{\partial^2}{\partial y^2}+\frac{\partial^2}{\partial z^2} \right) \psi + V \psi $$

17. Mermaid

17.1 流程图

源码 1：

```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;
```

渲染 1：

graph TB
	%% s=start  e=end  f=fork  n=normal
	
	s([开始])-->f1{{if条件}};

	%% 分支点1
	f1--true-->n1[if语句块]-->e([结束]);
	f1--false-->f2{{else if条件}};

	%% 分支点2 
	f2--true-->n2[else if语句块]-->e;
	f2--false-->n3[else语句块]-->e;

源码 2：

```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[朱高炽]
```

渲染 2：

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[朱高炽]

17.2 饼图

源码：

```mermaid
pie
    title 为什么总是宅在家里？
    "喜欢宅" : 45
    "天气太热" : 70
    "穷" : 500
	"关你屁事" : 95
```

渲染：

pie
    title 为什么总是宅在家里？
    "喜欢宅" : 45
    "天气太热" : 70
    "穷" : 500
	"关你屁事" : 95

17.3 序列图 (时序图)

源码：

```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
```

渲染：

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
        end

17.4 甘特图

源码：

```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
```

渲染：

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

17.5 类图

源码：

```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()
    }
```

渲染：

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()
    }

18. 标签 (Tag)

格式：

关于空格

关于数字

标签的嵌套

在标签名内，使用 / 斜杠 可以实现标签的嵌套

格式：

嵌套标签可以像普通标签一样通过点击来唤起搜索，嵌套标签允许你选择搜索的层次。例如：

能被使用的符号

综上所述，标签内能被使用的符号共有三种

  1. _ 下划线
  2. - 连字符
  3. / 斜杠

如何让 # 不被识别

可以使用前面提到的转义符号 \ 反斜杠，与上述的 转义标题 类似

格式：

\#这里的内容不会被识别为标签

效果：

#这里的内容不会被识别为标签

19. 避免标识符的滥用

即使在 Markdown 中，也要尽量避免标识符的滥用

比如我的这篇教程，就存在一定程度的滥用

标识符的本质是突出显示，代表重点

有三种标识，慎用！

  1. 词中对单个汉字的标识
    1. 卧==虎==藏==龙==
  2. 短语中对单个英语单词的标识
    1. get a ==bang== out of
  3. 标识符的多层嵌套
    1. 我感觉快要==原地 起飞==了

原因：

20. Callouts

20.1 Callouts 语法

Callouts 以前是第三方插件 Admonitions 的功能，现在被内置到 OB 自身，在 ==Publish== 中也可使用

格式

> [!类型] 标题
> 内容

注：

  1. 不要忘记 >
  2. ] 与 标题 间有 空格

示范

[!note] 这是一个 callout 标题 这里是 callout 里的内容 [[#20 Callout blocks|callout]] 内部支持双链

  • 同样支持==MD 语法==

源码

> [!note] 这是一个callout标题
> 这里是callout里的内容
> [[#20 Callout blocks|callout]]内部支持双链
> - 同样支持==MD语法==

20.2 折叠与展开

[!note] 默认是展开的，且不能折叠

如果想让 Callouts 有折叠的功能，可在 ] 后面加上 + 加号

示范

> [!note]+ 这是一个可折叠的标题
> 这里的内容可通过点击 **Callouts标题** 折叠起来

效果

[!note]+ 这是一个可折叠的标题 这里的内容可通过点击 Callouts 标题 折叠起来

在后面加上 - 减号，默认处于折叠状态 [!note]-

示范

> [!note]- 这是一个已被折叠的标题 （点击可展开）
> 里面的内容默认看不到

效果

[!note]- 这是一个已被折叠的标题（点击可展开） 里面的内容默认看不到

20.3 Callouts 类别

默认共支持12 种类别 （可自己在 Admonitions 插件 里添加）

  1. note
  2. abstract, summary, tldr
  3. info, todo
  4. tip, hint, important
  5. success, check, done
  6. question, help, faq
  7. warning, caution, attention
  8. failure, fail, missing
  9. danger, error
  10. bug
  11. example
  12. quote, cite

举例

> [!bug] 这是一个bug类别
> 这里是内容

[!bug] 这是一个 bug 类别 这里是内容

20.4 多层嵌套

Callouts 支持多层嵌套

示范

> [!failure] 这是第一层
> 这里是第一层的内容
>> [!bug]+ 这是嵌套的第二层
>> 这里是第二层的内容
>>> [!warning]- 这是嵌套的第三层，且默认为折叠状态
>>> 这里是第三层被折叠的内容

效果

[!failure] 这是第一层 这里是第一层的内容

[!bug]+ 这是嵌套的第二层 这里是第二层的内容

[!warning]- 这是嵌套的第三层，且默认为折叠状态 这里是第三层被折叠的内容

支持用 CSS 来自定义类型和图标，不过我个人没怎么用

具体可戳 Use callouts - Obsidian Help

Footnotes

  1. 周树人 ↩

  2. 绍兴人 ↩

Next Post
主题更新教程