Markdown的基本语法

Markdown的基本语法

July 8, 2020

第一篇正式文章吧,记录Markdown的用法。

标题 #

使用 # 号可表示 1-6 级标题:

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

段落格式 #

换行 #

行尾的两个以上空格加回车(换行) or 段落后使用一个空行(新段)。

**空格:**在输入连续的空格后,Typora 会在编辑器视图里为你保留这些空格,但当你打印或导出时,这些空格会被省略成一个。你可以在源代码模式下,为每个空格前加一个 \ 转义符,或者直接使用 HTML 风格的 &nbps; 来保持连续的空格。

**软换行:**需要说明的是,在 Markdown 语法中,换行(line break)与换段是不同的。且换行分为软换行和硬换行。在 Typora 中,你可以通过 Shift + Enter 完成一次软换行。软换行只在编辑界面可见,当文档被导出时换行会被省略。

**硬换行:**你可以通过 空格 + 空格 + Shift + Enter 完成一次硬换行,而这也是许多 Markdown 编辑器所原生支持的。硬换行在文档被导出时将被保留,且没有换段的段后距。

**换段:**你可以通过 Enter 完成一次换段。Typora 会自动帮你完成两次 Shift + Enter 的软换行,从而完成一次换段。这也意味着在 Markdown 语法下,换段是通过在段与段之间加入空行来实现的。

字体 #

*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___

斜体文本
斜体文本
粗体文本
粗体文本
粗斜体文本
粗斜体文本

分隔线 #

用三个以上的星号、减号、底线来建立一个分隔线,行内不能有其他东西。

***
* * *
- - -
--------



删除线 #

BAIDU.COM
~~BAIDU.COM~~

BAIDU.COM
BAIDU.COM

下划线 #

<u>带下划线文本</u>

带下划线文本

脚注 #

脚注是对文本的补充说明。

创建脚注格式类似这样 [^RUNOOB]。

[^RUNOOB]: 菜鸟教程 -- 学的不仅是技术,更是梦想!!!

创建脚注格式类似这样 1

列表 #

无序列表 #

无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记:

* 无序列表一
+ 无序列表二
- 无序列表二
  • 无序列表一
  • 无序列表二
  • 无序列表三

有序列表 #

有序列表则使用数字接着一个英文句点:

1. 有序列表一
2. 有序列表二
  1. 有序列表一
  2. 有序列表二

列表嵌套 #

列表嵌套只需在子列表中的选项添加四个空格即可

1. 第一项:
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2. 第二项:
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素
  1. 第一项:
    • 第一项嵌套的第一个元素
    • 第一项嵌套的第二个元素
  2. 第二项:
    • 第二项嵌套的第一个元素
    • 第二项嵌套的第二个元素

区块 #

区块引用是在段落开头使用 > 符号 ,然后后面紧跟一个空格符号

Markdown 也允许你偷懒只在整个段落的第一行最前面加上 >

引用的区块内也可使用其他的 Markdown 语法,包括标题、列表、代码区块等

> 你是猪吗?孩子
>> 是的 我是猪  
我真的是猪

你是猪吗?孩子

是的 我是猪
我真的是猪

代码 #

行内代码:用反引号"`“包括起来

`printf()` 函数

printf() 函数

多行代码:
(1)代码区块使用一个制表符(不推荐,格式有点不正常)
(2)用六个反引号```包裹代码(后面可跟上c/java/php/js/py/go/xml/html/matlab/go等等)

package main
import "fmt"
func main(){
    fmt.Println("Hello,World!");
}

链接 #

超链接 #

[链接名称](链接地址 "链接标题,可不加")
or
<链接地址>
or
[链接文字][链接标记]
在文本的任意位置添加
[链接标记]:链接地址 "链接标题"

百度一下

锚点 #

锚点其实就是页内超链接,实现快速跳到页面指定位置:

目的地{#index}
[跳转](#index)

目的地{#dst}
跳转

图片 #

![alt 属性文本](图片地址)
or
![alt 属性文本](图片地址 "可选标题")
or
![alt 属性文本][标记]
在文本的任意位置添加
[标记]:图片地址 "可选标题"

[alt 属性文本]其实是图片未正常显示时的替换文字。

RUNOOB 图标

表格 #

第一行为表头,第二行分隔表头和主体部分

使用 | 来分隔不同的单元格,使用 - 来分隔表头和其他行。

左对齐 | 右对齐 | 居中对齐
:-----| ----: | :----:
单元格 | 单元格 | 单元格
单元格 | 单元格 | 单元格
左对齐 右对齐 居中对齐
单元格 单元格 单元格
单元格 单元格 单元格

高级技巧 #

html原始码 #

在代码区块里面, & 、 < 和 > 会自动转成 HTML 实体

<div class="footer">
   © 2004 Foo Corporation
</div>

转义 #

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

公式 #

行内公式:

$E=mc^2$

$E=mc^2$

多行公式:

$$E=mc^2$$

$$E=mc^2$$

Buttons #

一种跳转到本地或外部链接的风格。

{{< button relref="/" [class="..."] >}}Get Home{{< /button >}}
{{< button href="https://github.com/alex-shpak/hugo-book" >}}Contribute{{< /button >}} 
Get Home Contribute

Columns #

{{< columns >}}
**Left Content**
Lorem markdownum insigne.
<--->
**Mid Content**
Lorem markdownum insigne.
<--->
**Right Content**
Lorem markdownum insigne. 
{{< /columns >}}

Left Content

Lorem markdownum insigne.

Mid Content

Lorem markdownum insigne.

Right Content

Lorem markdownum insigne.

Expand #

{{< expand "Custom Label" "..." >}}
## Markdown content
Lorem markdownum insigne...
{{< /expand >}}

Hints #

{{< hint [info|warning|danger] >}} 
各种级别的提示信息。。。
{{< /hint >}}
*info* 级别的提示信息···
*warning* 级别的提示信息···
*danger* 级别的提示信息···

Mermaid #

Mermaid是一种基于Javascript的绘图工具,使用类似于Markdown的语法,使用户可以方便快捷地通过代码创建图表。

{{< mermaid >}}
sequenceDiagram
    Alice->>Bob: Hello Bob, how are you?
    alt is sick
        Bob->>Alice: Not so good :(
    else is well
        Bob->>Alice: Feeling fresh like a daisy
    end
    opt Extra response
        Bob->>Alice: Thanks for asking
    end
{{< /mermaid >}}

sequenceDiagram Alice->>Bob: Hello Bob, how are you? alt is sick Bob->>Alice: Not so good :( else is well Bob->>Alice: Feeling fresh like a daisy end opt Extra response Bob->>Alice: Thanks for asking end


使用Typora可以更加方便的编写markdown文档,而不用手写代码,强力推荐。
本文参考: Typora中文官网    Markdown中文官网    UML-Mermaid


  1. 菜鸟教程 – 学的不仅是技术,更是梦想!!! ↩︎