0014.Markdown语法

0014.Markdown语法

本文参考Markdown 官方教程
https://markdown.com.cn/basic-syntax/

1.Markdown 标题

使用 # 号标记
使用 # 号可表示 1-6 级标题，一级标题对应一个 # 号，二级标题对应两个 # 号，以此类推。

2.Markdown 段落

Markdown 段落没有特殊的格式，直接编写文字就好，段落的换行是使用两个以上空格加上回车。

3.字体

Markdown 可以使用以下几种字体：
斜体文本
斜体文本
粗体文本
粗体文本
粗斜体文本
粗斜体文本

4.分隔线

你可以在一行中用三个以上的星号、减号、底线来建立一个分隔线，行内不能有其他东西。你也可以在星号或是减号中间插入空格。下面每种写法都可以建立分隔线：

---

---

---

---

---

5.删除线

如果段落上的文字要添加删除线，只需要在文字的两端加上两个波浪线 ~~ 即可，实例如下：
BAIDU.COM

6.Markdown 列表

Markdown 支持有序列表和无序列表。

• 无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记，这些标记后面要添加一个空格，然后再填写内容
• 有序列表使用数字并加上 . 号来表示

7.代码区块

• 代码区块使用 4 个空格或者一个制表符（Tab 键）。
• 你也可以用 ``` 包裹一段代码，并指定一种语言（也可以不指定）：

8.Markdown 链接

链接使用方法如下：

[链接名称](链接地址)

或者

<链接地址>

9.Markdown 图片

Markdown 图片语法格式如下：

![alt 属性文本](图片地址)

![alt 属性文本](图片地址 "可选标题")

开头一个感叹号 !
接着一个方括号，里面放上图片的替代文字
接着一个普通括号，里面放上图片的网址，最后还可以用引号包住并加上选择性的 ‘title’ 属性的文字。

• Markdown 还没有办法指定图片的高度与宽度，如果你需要的话，你可以使用普通的 标签。

<img src="http://static.runoob.com/images/runoob-logo.png" width="50%">

10.便签

{% note success %}
文字 或者 `markdown` 均可
{% endnote %}

可选便签：

primary

secondary

success

danger

warning

info

light

WARNING

使用时 {% note primary %} 和 {% endnote %} 需单独一行，否则会出现问题

11.行内标签

{% label primary @text %}

可选 Label：
primary default info success warning danger

12.折叠块

使用折叠块，可以折叠代码、图片、文字等任何内容，你可以在 markdown 中按如下格式：

{% fold info @title %}
需要折叠的一段内容，支持 markdown
{% endfold %}

info: 和行内标签类似的可选参数 title: 折叠块上的标题

13.勾选框

在 markdown 中加入如下的代码来使用 Checkbox：

{% cb text, checked?, incline? %}

text：显示的文字
checked：默认是否已勾选，默认 false
incline: 是否内联（可以理解为后面的文字是否换行），默认 false

示例：

{% cb 普通示例 %}
{% cb 默认选中, true %}
{% cb 内联示例, false, true %} 后面文字不换行
{% cb false %} 也可以只传入一个参数，文字写在后边（这样不支持外联）

14.按钮

{% btn url, text, title %}

url：跳转链接
text：显示的文字
title：鼠标悬停时显示的文字（可选）

15.脚注

语法如下：

这是一句话[^1]

[^1]: 这是对应的脚注

更优雅的使用方式，是将脚注写在文末，比如：

正文

## 参考
[^1]: 参考资料1
[^2]: 参考资料2

列表

有序列表

1. 天干
   1. 甲
   2. 乙
   3. 丙
   4. 丁
2. 地支
   1. 子
   2. 丑
   3. 寅
   4. 卯

无序列表

• 天干
  • 甲
  • 乙
  • 丙
  • 丁
• 地支
  • 子
  • 丑
  • 寅
  • 卯

引用

欲穷千里目，更上一层楼

举头望明月，低头思故乡

今春看又过，何日是归年

代码

内联代码

import

代码段

// 如何实现一个防抖函数
function debounce (f, wait) {
  let timer
  return (...args) => {
    clearTimeout(timer)
    timer = setTimeout(() => f(...args), wait)
  }
}

标题

以下是关于标题的样式

一级标题

二级标题

三级标题

主题

多主题被我开源在了 Github 仓库: markdown-theme。

Theme	中文	Author	Preview
github	-	sindresorhus/github-markdown-css	Preview
shanchui	山吹	#66CCFF	Preview
shanyue	山月	shanyue	Preview
condensed-night-purple	凝夜紫	童欧巴	Preview