Typora极简教程

发表于 | 分类于 ， | 评论数：

摘要： Markdown 是一种轻量级标记语言，创始人是约翰·格鲁伯（John Gruber）。它允许人们 “使用易读易写的纯文本格式编写文档，然后转换成有效的 HTML 文档。”

下载

Typora官方下载：https://www.typora.io/#download

常用快捷键

  • 加粗： Ctrl/Cmd + B
  • 标题： Ctrl/Cmd + H
  • 插入链接： Ctrl/Cmd + K
  • 插入代码： Ctrl/Cmd + Shift + C
  • 行内代码： Ctrl/Cmd + Shift + K
  • 插入图片： Ctrl/Cmd + Shift + I
  • 无序列表： Ctrl/Cmd + Shift + L
  • 撤销： Ctrl/Cmd + Z
  • 一级标题：快捷键为Ctrl + 1，以此类推

引用文字

1
2
3
4
> + 空格 + 引用文字
> 引用内容1
> 引用内容2
>> 引用内容3

引用内容1
引用内容2

引用内容3

列表

输入 列表内容 将创建一个无序列表，该符号可以替换为+或-。

无序列表

1
2
3
* 无序列表1
+ 无序列表2
- 无序列表3
  • 无序列表1
  • 无序列表2
  • 无序列表3

有序列表

1
2
3
1. 有序列表1
2. 有序列表2
3. 有序列表3
  1. 有序列表1
  2. 有序列表2
  3. 有序列表3

多行无序列表

1
2
3
* 多行无序列表1
TAB * 多行无序列表2
TAB TAB * 多行无序列表3
  • 多行无序列表1
    • 多行无序列表2
      • 多行无序列表3

任务列表

1
2
3
-[ ] 不抽烟
-[x] 不喝酒
-[ ] 不烫头

-[ ] 不抽烟
-[x] 不喝酒
-[ ] 不烫头

表格

1
2
3
4
5
6
|姓名|性别|年龄|手机号|
|:---|:--:|:--:|---:|
|居左|居中|居中|居右|
|张三|男|21|18975346876|
|李四|女|23|17789548964|
|王五|男|25|15876513546|
姓名 性别 年龄 手机号
居左 居中 居中 居右
张三 男 21 18975346876
李四 女 23 17789548964
王五 男 25 15876513546

链接

图片

本地图片

1
[图片上传失败...(image-61fd19-1520850984854)]

网络图片

1
![pikachu.jpg](https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1564157419510&di=e96d9359d9cba4b936ed55eb804c54bb&imgtype=0&src=http%3A%2F%2Fdata.whicdn.com%2Fimages%2F3045613%2Flarge.jpg)

pikachu.jpg

超链接

行内式链接

1
[我的博客][https://hongcyu.github.io]

[我的博客][https://hongcyu.github.io]

参考式链接

1
2
[CSDN][CSDN网址]
[CSDN网址]:https://www.csdn.net/

CSDN

自动链接

1
2
3
<https://www.github.com>
或
https://www.github.com

https://www.github.com

https://www.github.com

其他

斜体

1
2
*斜体*
_斜体_

斜体
斜体

加粗

1
2
**加粗**
__加粗__

加粗
加粗

下划线

1
<u>下划线</u>

下划线

删除线

1
~~删除线~~

删除线

分隔线

1
2
3
***
---
___

注脚

1
2
Typora[^1]
[^1]A markdown editor

Typora[^1]
[^1]A markdown editor

符号的输入

1
2
3
4
5
6
7
8
9
10
11
12
\\   反斜线
\`   反引号
\*   星号
\_   底线
\{ \}  花括号
\[ \]  方括号
\( \)  括弧
\#   井字号
\+   加号
\-   减号
\.   英文句点
\!   惊叹号

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

特殊字符

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
&copy;      版权      
&reg;       注册商标
&trade;     商标
&nbsp;      空格
&amp;       和号
&quot;      引号
&apos;      撇号
&lt;        小于号
&gt;        大于号
&ne;        不等号
&le;        小于等于
&ge;        大于等于
&cent;      分
&pound;     磅
&euro;      欧元
&yen;       元
&sect;      节
&times;     乘号
&divide;    除号
&plusmn;    正负号

© 版权
® 注册商标
™ 商标
  空格
& 和号
" 引号
' 撇号
< 小于号
> 大于号
≠ 不等号
≤ 小于等于
≥ 大于等于
¢ 分
£ 磅
€ 欧元
¥ 元
§ 节
× 乘号
÷ 除号
± 正负号

附件：[HTML特殊字符编码对照表][https://www.jb51.net/onlineread/htmlchar.htm]

插入音乐和视频

音乐

1）直接用 HTML 的标签，写法如下：

1
<audio src="https://什么什么什么.mp3" style="max-height :100%; max-width: 100%; display: block; margin-left: auto; margin-right: auto;" controls="controls" loop="loop" preload="meta">Your browser does not support the audio tag.</audio>

2）用插件，有显示歌词功能，也美观。首先在站点文件夹根目录安装插件：

1
npm install hexo-tag-aplayer --save

然后文章中的写法：

1
{% aplayer "歌曲名" "歌手名" "https://什么什么什么.mp3" "https://封面图.jpg" "lrc:https://歌词.lrc" %}

另外可以支持歌单：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
{% aplayerlist %}
{
    "autoplay": false,
    "showlrc": 3,
    "mutex": true,
    "music": [
        {
            "title": "歌曲名",
            "author": "歌手名",
            "url": "https://什么什么什么.mp3",
            "pic": "https://封面图.jpg",
            "lrc": "https://歌词.lrc"
        },
        {
            "title": "歌曲名",
            "author": "歌手名",
            "url": "https://什么什么什么.mp3",
            "pic": "https://封面图.jpg",
            "lrc": "https://歌词.lrc"
        }
    ]
}
{% endaplayerlist %}

里面的详细参数见 README 和这插件的「母亲」Aplayer 的官方文档。关于 LRC歌词，可以用工具下载网易云音乐的歌词，另发现暂时不支持offset参数。当然，如果那歌词很操蛋，有错误（比如字母大小写和标点符号乱加）或者时间完全对不上，然后你也和我一样是个完美主义者，那接下来就是令人窒息的操作了，一句一句自己查看修改……

什么，你想把网易云的几百首歌手动同步到博客？慢慢慢，有一种非常简单的方法，此这种方法也支持单曲，将参数里的playlist更改为song即可，非常建议食用！更多功能请仔细阅读 README。

视频

1）直接用 HTML 的标签，写法如下：

1
<video poster="https://封面图.jpg" src="https://什么什么什么.mp4" style="max-height :100%; max-width: 100%; display: block; margin-left: auto; margin-right: auto;" controls="controls" loop="loop" preload="meta">Your browser does not support the video tag.</video>

2）用插件，可支持弹幕，首先在站点文件夹根目录安装插件：

1
npm install hexo-tag-dplayer --save

然后文章中的写法：

1
{% dplayer "url=https://什么什么什么.mp4" "https://封面图.jpg" "api=https://api.prprpr.me/dplayer/" "id=" "loop=false" %}

要使用弹幕，必须有api和id两项，并且若使用的是官方的 api 地址（即上面的），id 的值不能与这个列表的值一样。id 的值自己随便取，唯一要求就是前面这点。如果唯一要求难倒了你，可以使用这个工具将一段与众不同的文字生成一段看起来毫无意义的哈希值，这样看起来是不是好多了。

当然，这个插件的功能还有很多，可以去 README 和这插件的「母亲」Dplayer 的官方文档看看。

-------　本文结束　　感谢您的阅读　-------