Henry
Henry
2019-10-06
目录

Markdown 简明教程

Markdown 是一种轻量级的「标记语言」, 它的优点很多, 目前也被越来越多的写作爱好者, 撰稿者广泛使用. 看到这里请不要被「标记」、「语言」所迷惑, Markdown 的语法十分简单. 常用的标记符号也不超过十个, 这种相对于更为复杂的 HTML 标记语言来说, Markdown 可谓是十分轻量的, 学习成本也不需要太多, 且一旦熟悉这种语法规则, 会有一劳永逸的效果.

# 使用 Markdown 的优点

  • 专注你的文字内容而不是排版样式.
  • 轻松的导出 HTML、PDF 和本身的 .md 文件.
  • 纯文本内容, 兼容所有的文本编辑器与字处理软件.
  • 可读, 直观. 适合所有人的写作语言.

# 工具

工具茫茫多

# 语法

# 标题

标题有六级

由 # 组成

类比于 h1 ~ h6

例如:


# 这是一级标题（H1，通常用于文档标题）

## 这是二级标题（H2，有些渲染器会为二级标题添加 hr 底线）

### 这是三级标题（H3）

#### 这是四级标题（H4）

##### 这是五级标题（H5）

###### 这是六级标题（H6）
1
2
3
4
5
6
7
8
9
10
11
12
13

效果:

# 这是一级标题(H1, 通常用于文档标题)

# 这是二级标题(H2, 有些渲染器会为二级标题添加 hr 底线)

# 这是三级标题(H3)

# 这是四级标题(H4)

# 这是五级标题(H5)
# 这是六级标题(H6)

注: 在 # 后加一个空格再跟标题

# 首行缩进

    写文章时, 我们常常希望能够首行缩进, 这时可以在段首加入   或   来输入一个空格. 加入   来输入两个空格. 这里的空格是英文状态的空格, 英文状态的两个空格相当于中文状态的一个空格

# 添加空行

添加空行可以结束先前的格式状态. 个人建议在改变格式时均添加一个空行

例如:


> 引用状态

[空行]

### 标题状态

[空行]
---
[空行]

* 列表状态
* 列表状态

[空行]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

效果:

引用状态

# 标题状态

  • 列表状态
  • 列表状态

# 换行

换行的时候 结尾要加上 两个空格.

在当前行的结尾加 2 个空格

这行就会新起一行

# 分隔符

你可以在一行中用三个以上的星号、减号、底线来建立一个分隔线, 行内不能有其他东西. 你也可以在星号或是减号中间插入空格. 当前后都有段落时, 请空出一行. 下面每种写法都可以建立分隔线:

前面的段落
[空行]

* * *

***

*****

- - -

---------------------------------------
[空行]
后面的段落
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

前面的段落

后面的段落

# 强调

  • 斜体: 使用 两个 * 或 _ 中间夹杂的就是 斜体, 例如: *斜体* _斜体_ 斜体 斜体
  • 粗体: 使用 四个 * 或 _ 中间夹杂的就是 粗体, 例如: **粗体** __粗体__ 粗体 粗体
  • 粗斜体文本: 使用 八个 * 或 _ 中间夹杂的就是 粗斜体文本, 例如: ****粗斜体**** ____粗斜体____ 粗斜体 粗斜体
  • 删除线: 使用 两个波浪线 ~ 中间夹杂的就是 删除线, 例如: ~~删除线~~ 删除线

但是, 如果你的 * 、 _ 和 ~ 两边都有空白的话, 它们就只会被当成普通的符号: 这是一段* 文本强调 *的说明示例.

\*如果要在文字前后直接插入普通的星号或底线，你可以用反斜线（转义符）\* : *如果要在文字前后直接插入普通的星号或底线, 你可以用反斜线(转义符)*

# 无序列表

使用 + - * 都表示无序列表

注: 后面也需要跟一个空格

例如:


* 使用 - 号
  - 吃饭
  - 睡觉
  - 打豆豆
  - 再打豆豆
    - 接着打豆豆
* 使用 + 号
  + 吃饭
  + 睡觉
  + 打豆豆
* 使用 * 号
  * 吃饭
  * 睡觉
  * 打豆豆
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

效果:

  • 使用 - 号
    • 吃饭
    • 睡觉
    • 打豆豆
    • 再打豆豆
      • 接着打豆豆
  • 使用 + 号
    • 吃饭
    • 睡觉
    • 打豆豆
  • 使用 * 号
    • 吃饭
    • 睡觉
    • 打豆豆

# 有序列表

使用 1. 2. 3. 可以表示有序列表

注: 后面也需要跟一个空格

例如:


1. 买菜
4. 洗菜
5. 切菜
8. 炒菜
9. 吃菜
6. 洗碗
1
2
3
4
5
6
7
8

效果:

  1. 买菜
  2. 洗菜
  3. 切菜
  4. 炒菜
  5. 吃菜
  6. 洗碗

注: 前面数字可以不按顺序来

# 列表嵌套


1. 列出所有元素：
    - 无序列表元素 A
        1. 元素 A 的有序子列表
    - 前面加四个空格
2. 列表里的多段换行：

    前面必须加四个空格，
    这样换行，整体的格式不会乱

3. 列表里引用：

    > 前面空一行

    > 仍然需要在 >  前面加四个空格

4. 列表里代码段：

    前面四个空格, 之后按代码语法书写

        或者直接空八个，引入代码块
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

  1. 列出所有元素:

    • 无序列表元素 A
      1. 元素 A 的有序子列表
    • 前面加四个空格

  2. 列表里的多段换行:

    前面必须加四个空格， 这样换行，整体的格式不会乱

  3. 列表里引用:

    前面空一行

    仍然需要在 > 前面加四个空格

  4. 列表里代码段:

    前面四个空格，之后按代码语法书写

    或者直接空八个，引入代码块

# 引用

使用 > 表示引用

例如:

> 海明威曾经写过：我可以被杀死，但是不可以被打败

效果:

海明威曾经写过: 我可以被杀死, 但是不可以被打败

# 引用嵌套


* 引用里嵌套引用

> 最外层引用
> > 多一个 > 嵌套一层引用
> > > 可以嵌套很多层

* 引用里嵌套列表

> - 这是引用里嵌套的一个列表
> - 还可以有子列表
> * 子列表需要从 - 之后延后四个空格开始
1
2
3
4
5
6
7
8
9
10
11
12
13
  • 引用里嵌套引用

最外层引用

多一个 > 嵌套一层引用

可以嵌套很多层

  • 引用里嵌套列表
  • 这是引用里嵌套的一个列表
  • 还可以有子列表
  • 子列表需要从 - 之后延后四个空格开始

# 表格


| 默认对齐 | 居左对齐 | 居中对齐 | 居右对齐 |
|---|:---|:---:|---:|
| 窗前 | 明月 | 光 |, |
| 疑是 | 地上 | 霜 |, |

| 姓名 | 性别 | 年纪 | 班级 |
|--|:--|:--:|--|
| 张三 | 男 | 29|0830|
| 李四 | 女 | 28|0830|

| 时间 | 地点 | 人物 | 事件事件事件事件事件事件事件 |
|--|--|--|:--:|
| 上午 | 北京 | 我 | 吃面 |

| <div style="width: 265px;">可以在表头设置固定宽度</div> | 默认宽度 |
| -- | -- |
| 我的宽度为 265px | 我的宽度是默认的 |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

效果：

默认对齐 居左对齐 居中对齐 居右对齐
窗前 明月 光 ，
疑是 地上 霜 ，
姓名 性别 年纪 班级
张三 男 29 0830
李四 女 28 0830
时间 地点 人物 事件事件事件事件事件事件事件
上午 北京 我 吃面
可以在表头设置固定宽度
 默认宽度
我的宽度为 265px 我的宽度是默认的

注：表格开始与结尾都需要一行空行

# 插入代码

插入代码的方式有两种

  1. 在每行代码前加入 4 个空格或者添加一个制表符（TAB 键）. 制表符长度为 4
  2. 在代码两侧添加三个反引号 ```。

# 方式一

其缩进是相对于当前格式状态下的。

例如：


* 列表项
* 列表项

[空行]
[TAB][TAB]console.log('hello world!')
[空行]
本例中制表符长度为 2
1
2
3
4
5
6
7
8
9

效果：

  • 列表项

  • 列表项

    console.log('hello world!')

# 方式 2

如果你只想高亮语句中的某个函数名或关键字，可以使用这个符号 ` 中间夹着代码: `function_name()` function_name() 实现

通常编辑器根据代码片段适配合适的高亮方法，但你也可以用 ``` 包裹一段代码，并指定一种语言

```js

$(document).ready(function () {

alert('hello world');

});

```
1
2
3
4
5
6
7
8
9
// js
$(document).ready(function() {
  alert('hello world')
})
1
2
3
4
<!-- html -->
<ul>
  <li>好好学习</li>
  <li>天天向上</li>
  <li>锻炼身体</li>
</ul>
1
2
3
4
5
6
/* css */
a {
  color: red;
}
1
2
3
4

支持的语言: 1c, abnf, accesslog, actionscript, ada, apache, applescript, arduino, armasm, asciidoc, aspectj, autohotkey, autoit, avrasm, awk, axapta, bash, basic, bnf, brainfuck, cal, capnproto, ceylon, clean, clojure, clojure-repl, cmake, coffeescript, coq, cos, cpp, crmsh, crystal, cs, csp, css, d, dart, delphi, diff, django, dns, dockerfile, dos, dsconfig, dts, dust, ebnf, elixir, elm, erb, erlang, erlang-repl, excel, fix, flix, fortran, fsharp, gams, gauss, gcode, gherkin, glsl, go, golo, gradle, groovy, haml, handlebars, haskell, haxe, hsp, htmlbars, http, hy, inform7, ini, irpf90, java, javascript, json, julia, kotlin, lasso, ldif, leaf, less, lisp, livecodeserver, livescript, llvm, lsl, lua, makefile, markdown, mathematica, matlab, maxima, mel, mercury, mipsasm, mizar, mojolicious, monkey, moonscript, n1ql, nginx, nimrod, nix, nsis, objectivec, ocaml, openscad, oxygene, parser3, perl, pf, php, pony, powershell, processing, profile, prolog, protobuf, puppet, purebasic, python, q, qml, r, rib, roboconf, rsl, ruby, ruleslanguage, rust, scala, scheme, scilab, scss, smali, smalltalk, sml, sqf, sql, stan, stata, step21, stylus, subunit, swift, taggerscript, tap, tcl, tex, thrift, tp, twig, typescript, vala, vbnet, vbscript, vbscript-html, verilog, vhdl, vim, x86asm, xl, xml, xquery, yaml, zephir

在 这里 (opens new window) 可以找到 github 支持的语言

反引号最好在代码的前后行添加, 而不是直接加在代码两边.

如你不需要代码高亮, 可以用下面的方法禁用:

```
nohighlight

// js

$(document).ready(function () {

alert('hello world');

});

```
1
2
3
4
5
6
7
8
9
10
11
12
// js
$(document).ready(function () {
  alert('hello world');
});
1
2
3
4

# 链接

下面是行内链接示例:

[百度](http://www.baidu.com)
http://www.baidu.com
<http://www.baidu.com>
1
2
3

百度 (opens new window)

http://www.baidu.com

http://www.baidu.com (opens new window)

下面是一个参考链接的示例:

[链接到百度][1]

[链接到 Google][2]

[还是链接到百度][1]

[1]:https://www.baidu.com
[2]:https://www.google.com

注：
'[1]:https://www.baidu.com' 和 '[2]:https://www.google.com' 这几个链接可以写到文章的最后，就相当于 word 中的引用
1
2
3
4
5
6
7
8
9
10
11

效果:

链接到百度 (opens new window)

链接到 Google (opens new window)

还是链接到百度 (opens new window)

# 图片


![图片的 alt](图片的路径，可以是相对路径，也可以是绝对路径 "图片的 title")

例如：

![无名](/img/markdown/001.jpg "无名")

其中图片的 alt 和 title 可以不写
例如：
![](/img/markdown/001.jpg)
1
2
3
4
5
6
7
8
9
10

效果:

无名

图片也可以使用参考链接的形式

![无名][id]

[id]: /img/markdown/001.jpg "无名"
1
2
3

# 限制图片大小并居中

许多 MarkDown 编辑器中直接按原图大小显示图片, 造成版面凌乱. 使用该命令 <img src="图片地址" width="图片显示宽度" height="显示高度" alt="图片名称"/> 设置图片大小, 再用 <div style="text-align:center"></div> 命令包裹达到居中效果.

<div style="text-align:center">
  <img src="/img/markdown/002.gif" width="300" alt="发糖了!!!" />
</div>
1
2
3
发糖了!!!

# 使用表情

Git 中的 Markdown 语法扩展中包括了一些表情包.

用法: 使用两个冒号将表情夹杂起来即可

例如:

表情一：:tada:, 表情二：:bug:

效果:

表情一: 🎉 , 表情二: 🐛

更多表情可以查看 表情大全 (opens new window) 或 scotch-io/All-Github-Emoji-Icons (opens new window)

# 忽略 Markdown 关键字 (转义)

和 C 语言 printf 函数一样, 如果我们不想让某个字符转换成 Markdown 关键字, 可以在前面加上 \ . 比如我们想输入两个 *, 就可以用:

\*\* 取消 Markdown 关键字

效果: ** 取消 Markdown 关键字

# 折叠内容

当有一大段内容不是那么重要时, 我们可以先折叠起来, 需要的时候再展开查看

例如:

<details>
<summary>Title</summary>

content!!!
</details>
1
2
3
4
5

效果:

Title content!!!

# 实践

# 参考资料

编辑 (opens new window)
#Markdown
上次更新: 5/27/2023, 1:02:05 PM
git 基本指令

git 基本指令→

最近更新
01
version 1.15
07-01
02
version 1.14
06-27
03
version 1.13
06-27
更多文章>
Theme by Vdoing | Copyright © 2017-2023 HenryTSZ | MIT License