抛开排版的烦恼,优雅地记录世界!

image
image

1 前言

第一次接触Markdown是在考完研之后。那段时间,笔者正在家中学习计算机网络的视频课。因为其知识结构比较繁杂,手写记录起来也比较累,于是笔者想偷个懒,把课件上的知识点梳理好,存放在电脑中,以便不时翻阅温习。

后来成绩公布,笔者落榜,笔记也就不了了之。但是笔者依然对这个大宝贝情有独钟。想来,如今用其来写博客也是一件美妙的事情。

本文主要是把Mardown语法以及在Hexo框架下写作的一些技巧记录下来与诸位分享。

2 Mardown语法

2.1 标题

标题最低为六级标题,如:

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

2.2 段落

段落的前后要有空行,所谓的空行是指没有文字内容。若想在段内强制换行的方式是使用两个及以上空格加上回车。

2.2 区块引用

只在第一行使用或者在段落的每行符号>,还可使用多个嵌套引用。如:

> 区块引用
>> 嵌套引用

效果如下:

区块引用

嵌套引用

2.3 代码区块

代码区块表示有两种方式:

  1. 在每行加上4个空格或者一个制表符。
  2. 在代码前后行分别添加三个`符号。如需要,可在第一行的符号后输入对应的代码类型来实现代码高亮。

2.4 强调

在强调内容两侧分别加上*或者_。如:

*斜体*,_斜体_
**粗体**,__粗体__

效果:

斜体斜体
粗体粗体

2.5 列表

2.5.1 无序列表

无序列表的标记方式是使用-+、或·。如:

- 第一项
- 第二项
- 第三项

注意:标记后面最少有一个空格。若不在引用区块中,必须和前方段落之间存在空行。

效果如下:

  • 第一项
  • 第二项
  • 第三项

2.5.2 有序列表

有序列表的标记方式是将上述的符号换成数字,并辅以.。如:

1. 第一项
2. 第二项
3. 第三项

效果如下:

  1. 第一项
  2. 第二项
  3. 第三项

2.5.3 列表嵌套

列表嵌套的方式是在所需嵌套的列表项前添加四个空格或一个制表符。无序列表和有序列表可以相互嵌套。如:

- 第一项
    1. 嵌套有序第一项
        - 嵌套无序第一项
        - 嵌套无序第二项
        - 嵌套无序第三项
    2. 嵌套有序第二项
    3. 嵌套有序第三项
- 第二项
- 第三项

效果如下:

  • 第一项
    1. 嵌套有序第一项
      • 嵌套无序第一项
      • 嵌套无序第二项
      • 嵌套无序第三项
    2. 嵌套有序第二项
    3. 嵌套有序第三项
  • 第二项
  • 第三项

2.6 分割线

分割线最常使用就是三个或以上-,还可以使用*_

2.7 生成链接

链接的生成需使用[]()符号。如:

[YvanZh的博客](http://yvanzh.top/)

效果如下:

YvanZh的博客

2.8 插入图片

添加图片的形式和链接相似,使用![]()符号即可。

2.9 反斜杠

反斜杠\相当于反转义作用。使符号成为普通符号。

2.10 标记块

标记块使用符号`。如:

`ctrl+a`

效果如下:

ctrl+a

2.11 表格

使用|来分隔表格,使用前需空行。使用|-|分隔表头和表身。如:

|姓名|性别|年龄|
|---|---|---|
|YvanZh|男|11|

效果如下:

姓名 性别 年龄
YvanZh 11

更多说明:

  1. |-:之间的多余空格会被忽略,不影响布局。
  2. 默认居左对齐。 -:表示内容和标题栏居右对齐,:-表示内容和标题栏居左对齐,:-:表示内容和标题栏居中对齐。
  3. 内容和|之间的多余空格会被忽略,每行第一个|和最后一个|可以省略,-的数量至少有一个。

3 Hexo写作技巧

3.1 主页文章摘要

  1. 使用<!--more-->,可使得在此之前的内容作为摘要出现在主页中,同时也会出现在文章详情中。
  2. 在文章中的front-matter中添加description:,并提供文章摘录。则首页中会显示文章的摘要内容,而文章详情后不会再显示。比如:

2019年4月6日:更换indigo主题后色块不可用。

    ## 3.2 `Next`主题自带引用块
{% cq %}
    我是引用内容。
    {% endcq %}
```

效果如下:

{% cq %}
    我是引用的内容。
    {% endcq %}

## 3.3 `Next`主题自带色块

主题共自带六种色块,分别为:default、success、danger、primary、info、warning。使用色块的方式为:

```
{% note 色块类型 %}
    我是色块的内容。
    {% endnote %}
```

1. default色块

{% note default %}
    我是default色块的内容。
    {% endnote %}

1. success色块

{% note success %}
    我是success色块的内容。
    {% endnote %}

1. danger色块

{% note danger %}
    我是danger色块的内容。
    {% endnote %}

1. primary色块

{% note primary %}
    我是primary色块的内容。
    {% endnote %}

1. info色块

{% note info %}
    我是info色块的内容。
    {% endnote %}

1. warning色块

{% note warning %}
    我是warning色块的内容。
    {% endnote %}

## 3.4 `Next`主题自带Tabs

需在主题配置文件`_config.yml`中,将`Tabs Tag`相关设置改为`true`。

Tabs显示效果类似于选项卡。使用Tabs的方式为:

```
{% tabs 选项卡, 2 %}
    
    **这是选项卡 1** 哇,你找到我了!φ(≧ω≦*)♪~
    
    
    **这是选项卡 2**
    
    
    **这是选项卡 3** 哇,你找到我了!φ(≧ω≦*)♪~
    
    {% endtabs %}
```

上方的源码中, 数字`2`表示初始显示的是第二个选项卡。非必须,若数值为`-1`则隐藏选项卡内容。

效果如下:

{% tabs 选项卡, 2 %}
    
    **这是选项卡 1** 哇,你找到我了!φ(≧ω≦*)♪~
    
    
    **这是选项卡 2**
    
    
    **这是选项卡 3** 哇,你找到我了!φ(≧ω≦*)♪~
    
    {% endtabs %}

```