[toc]

Typore简介

Typora是一款轻便简洁的Markdown编辑器，支持即时渲染技术，这也是与其他Markdown编辑器最显著的区别。即时渲染使得你写Markdown就想是写Word文档一样流畅自如，不像其他编辑器的有编辑栏和显示栏。

Markdown介绍

Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档。
Markdown 语言在 2004 由约翰·格鲁伯（英语：John Gruber）创建。
Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多种格式的文档。
Markdown 编写的文档后缀为 .md, .markdown。

常用快捷键

加粗： Ctrl + B 字体倾斜：Ctrl+I 下划线 ：Ctrl+U

插入链接：Ctrl + K 创建表格：Ctrl+T

行内代码：Ctrl + Shift + K 插入图片：Ctrl + Shift + I 插入图片：Ctrl+Shift+M

选中某句话：Ctrl+L 选中某个单词： Ctrl+D 搜索：Ctrl+F

搜索并替换：Ctrl+H 选中相同格式的文字：Ctrl+E 删除线：Alt+Shift+5

撤销： Ctrl + Z 返回Typora顶部：Ctrl+Home 返回Typora底部：Ctrl+End

公式块：Ctrl+Shift+I 引用：Ctrl+Shift+Q

标题： Ctrl + 1（一级标题）；Ctrl + 2（二级标题） – 以此类推

引用文字

Markdown 使用电子邮件样式>字符进行块引用。它们表示为：

> 这是一个有两段的块引用。这是第一段。
>
> 这是第二段。Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.



> 这是另一个只有一个段落的块引用。有三个空行分隔两个块引用。

在typora中，只需输入’>’后跟引用内容即可生成块引用。Typora将为您插入正确的“>”或换行符。通过添加额外级别的“>”允许在块引用内嵌入另一个块引用。

元素列表

无序列表

使用 * + - 都可以创建一个无序列表

* AAA
+ BBB
- CCC

有序列表

使用 1. 2. 3. 创建有序列表

1. AAA
2. BBB
3. CCC

任务列表

任务列表是标记为[ ]或[x]（未完成或完成）的项目的列表。例如：

- [ ] 这是一个任务列表项
- [ ] 需要在前面使用列表的语法
- [ ] normal **formatting**, @mentions, #1234 refs
- [ ] 未完成
- [x] 完成

您可以通过单击项目前面的复选框来更改完成/未完成状态。

代码块

在Typora中插入程序代码的方式有两种：使用反引号 `（~ 键）、使用缩进（Tab）。

  • 插入行内代码，即插入一个单词或者一句代码的情况，使用 code 这样的形式插入。

  • 插入多行代码输入3个反引号（`） + 回车，并在后面选择一个语言名称即可实现语法高亮。

print("hell oword")

数学公式块

您可以使用 MathJax 渲染 LaTeX 数学表达式。

输入 $$, 然后按“return”键将触发一个接受Tex / LaTex源代码的输入区域。以下是一个例子：

在 markdown 源文件中，数学公式块是由’$$’标记包装的 LaTeX 表达式：

$$
\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}
$$

LeTeX表达式参考连接：超详细 LaTex数学公式 LaTeX：公式常用字符和表达式

表格

输入 | First Header | Second Header | 并按下 return 键将创建一个包含两列的表。

创建表后，焦点在该表上将弹出一个表格工具栏，您可以在其中调整表格，对齐或删除表格。您还可以使用上下文菜单来复制和添加/删除列/行。

可以跳过以下描述，因为表格的 markdown 源代码是由typora自动生成的。

在 markdown 源代码中，它们看起来像这样：

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |

您还可以在表格中包括内联 Markdown 语法，例如链接，粗体，斜体或删除线。

  • 不管是哪种方式，第一行为表头，第二行为分割表头和主体部分，第三行开始每一行为一个表格行
  • 列与列之间用管道符号| 隔开
  • 还可设置对齐方式(表头与内容之间)，如果不使用对齐标记，内容默认左对齐，表头居中对齐
    • 左对齐 ：|
    • 右对齐 |：
    • 中对齐 ：|：
  • 为了美观，可以使用空格对齐不同行的单元格，并在左右两侧都使用 | 来标记单元格边界
  • 为了使 Markdown 更清晰，| 和 - 两侧需要至少有一个空格（最左侧和最右侧的 | 外就不需要了）

脚注

您可以像这样创建脚注[^footnote].

[^footnote]: Here is the *text* of the **footnote**.

将产生：

您可以像这样创建脚注1.

鼠标移动到‘footnote’上标中查看脚注的内容。

水平线

输入 *** 或 --- 在空行上按 return 键将绘制一条水平线。

目录 (TOC)

输入 [toc] 然后按 Return 键将创建一个“目录”部分，自动从文档内容中提取所有标题，其内容会自动更新。

上下标

上标

可以使用<sup>文本</sup>实现上标。

(需在设置中打开该功能)

X2

下标

可以使用 <sub>文本</sub>实现下标。

(需在设置中打开该功能)

H2O

文本居中

使用 <center>这是要居中的内容</center>可以使文本居中

这是要居中的文本内容

Span 元素

在您输入后Span元素会被立即解析并呈现。在这些span元素上移动光标会将这些元素扩展为markdown源代码。以下将解释这些span元素的语法。

链接

Markdown 支持两种类型的链接：内联和引用。

在这两种样式中，链接文本都写在[方括号]内。

要创建内联链接，请在链接文本的结束方括号后立即使用一组常规括号。在常规括号内，输入URL地址，以及可选的用引号括起来的链接标题。例如：

This is [an example](http://example.com/ "Title") inline link.

[This link](http://example.net/) has no title attribute.

将产生：

This is an example inline link. (<p>This is <a href="http://example.com/" title="Title">)

This link has no title attribute. (<p><a href="http://example.net/">This link</a> has no)

内部链接

您可以将常规括号内的 href 设置为文档内的某一个标题，这将创建一个书签，允许您在单击后跳转到该部分。例如：

Command(在Windows上：Ctrl) + 单击 此链接 将跳转到标题 块元素处。 要查看如何编写，请移动光标或按住 ⌘ 键单击以将元素展开为 Markdown 源代码。

参考链接

参考样式链接使用第二组方括号，在其中放置您选择的标签以标识链接：

This is [an example][id] reference-style link.

然后，在文档中的任何位置，您可以单独定义链接标签，如下所示：

[id]: http://example.com/  "Optional Title Here"

在typora中，它们将呈现为：

This is an example reference-style link.

隐式链接名称快捷方式允许您省略链接的名称，在这种情况下，链接文本本身将用作名称。只需使用一组空的方括号，例如，将“Google”一词链接到google.com网站，您只需写下：

[Google][]
然后定义链接：

[Google]: http://google.com/

在typora中单击链接将其展开以进行编辑，command + 单击将在 Web 浏览器中打开超链接。

URL网址

Typora允许您将 URL 作为链接插入，用 <括号括起来>。

<i@typora.io> 成为 i@typora.io.

Typora也将自动链接标准URL。例如： www.google.com.

图片

图像与链接类似， 但在链接语法之前需要添加额外的 ! 字符。 图像语法如下所示：

![替代文字](/path/to/img.jpg)

![替代文字](/path/to/img.jpg "可选标题")

您可以使用拖放操作从图像文件或浏览器来插入图像。并通过单击图像修改 markdown 源代码。如果图像在拖放时与当前编辑文档位于同一目录或子目录中，则将使用相对路径。

流程图

教程来自知乎：https://zhuanlan.zhihu.com/p/40810821

Typora可以直接在markdown中画流程图，而且语法简洁易懂

  • sequence

语言选择sequence即可生成流程图

李雷 -> 韩梅梅: Hello 梅梅, How are you?
Note right of 韩梅梅: 韩梅梅心想
韩梅梅 --> 李雷: I'm fine, thanks, and you?
Created with Raphaël 2.2.0 background Layer 1 李雷 李雷 韩梅梅 韩梅梅 Hello 梅梅, How are you? 韩梅梅心想 I'm fine, thanks, and you?
  • flowchart

对于Flowchart,语法选择flow

st=>start: 闹钟响起
op=>operation: 与床板分离
cond=>condition: 分离成功?
e=>end: 快乐的一天

st->op->cond
cond(yes)->e
cond(no)->op
Created with Raphaël 2.2.0 background Layer 1 闹钟响起 与床板分离 分离成功? 快乐的一天 yes no
  • gantt

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

gantt
        dateFormat  YYYY-MM-DD
        title 快乐的生活
        section 吃一把鸡就学习
        学习            :done,    des1, 2014-01-06,2014-01-09
        疯狂学习               :active,  des2, 2014-01-09, 3d
        继续疯狂学习               :         des3, after des2, 5d
        吃鸡！               :         des4, after des3, 4d
        section 具体内容
        学习Python :crit, done, 2014-01-06,72h
        学习C++          :crit, done, after des1, 2d
        学习Lisp             :crit, active, 3d
        学习图形学        :crit, 4d
        跳伞           :2d
        打枪                      :2d

2014-01-072014-01-092014-01-112014-01-132014-01-152014-01-172014-01-192014-01-21学习 学习Python 疯狂学习 学习C++ 学习Lisp 继续疯狂学习 学习图形学 吃鸡！ 跳伞 打枪 吃一把鸡就学习具体内容快乐的生活

HTML

您可以使用HTML来设置纯 Markdown 不支持的内容，例如， <span style="color:red">this text is red</span> 用于添加红色文本。