Markdown写作Markdown写作

Markdown写作

Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息,如GitHubRedditDiasporaStack ExchangeOpenStreetMapSourceForge简书等,甚至还能被使用来撰写电子书

基础语法

分级标题

Markdown支持6种级别的标题,字号依级递减。
1
2
3
4
5
6
# 1级标题
## 2级标题
### 3级标题
#### 4级标题
##### 5级标题
###### 6级标题

字体

加粗 斜体 下划线 删除线
Hello World! Hello World! Hello World! Hello World!
1
2
3
4
5
6
7
8
9
10
11
# 加粗
**Hello World!**

# 斜体
*Hello World!*

# 下划线
<u>Hello World!</u>

# 删除线
~~Hello World!~~

引用

Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。

1
> Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。

文本概括

这是概括标题,点击展开标题对应内容。 One day, it’s sunny and warm. Some birds are singing in the trees. “What do you want to be when you grow up?’’ asks Tim. a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.
点击查看语法 >folded
1
2
3
4
<details>
<summary>这是概括标题,点击展开标题对应内容。</summary>
One day, it’s sunny and warm. Some birds are singing in the trees. “What do you want to be when you grow up?’’ asks Tim. a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.
</details>

列表

无序列表
  • One day, it’s sunny and warm. Some birds are singing in the trees.

  • “What do you want to be when you grow up?’’ asks Tim.

  • a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.

1
2
3
4
# 注意:以上“-”与内容之间有空格,“-”可采用“+”、“*”替代.
- One day, it’s sunny and warm. Some birds are singing in the trees.
- “What do you want to be when you grow up?’’ asks Tim.
- a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.

有序列表
  1. One day, it’s sunny and warm. Some birds are singing in the trees.

  2. “What do you want to be when you grow up?’’ asks Tim.

  3. a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.

1
2
3
4
# 注意:以下序号与内容之间有空格.
1. One day, it’s sunny and warm. Some birds are singing in the trees.
2. “What do you want to be when you grow up?’’ asks Tim.
3. a toy box or a baseball bat. I like children.”“What do you want to be when you grow up?” asks Alan.

当在一个列表中出现多个段落时,首字母必须缩进一次以保证正常渲染.

  • 第一段落
    第二段落
  • 第一段落
    第二段落
1
2
3
4
-    第一段落
第二段落
- 第一段落
第二段落

分割线



1
2
---
***

插入链接或图片

「📌点击下载 Hello Markdown」

Hello Markdown
1
2
3
4
5
# 插入链接
[点击获取Hello Markdown.jpg](https://xxx.../Hello Markdown.jpg)

# 插入图片
![Hello Markdown](https://xxx.../Hello Markdown.jpg)

表格

Title1 Title2 Title3
1row-1column 1row-2column 1row-3column
2row-1column 2row-2column 2row-3column
表格的语法稍微有点复杂
点击查看语法 >folded
1
2
3
4
|    Title1    |    Title2    |    Title2    |
| :----------: | :----------: | :----------: |
| 1row-1column | 1row-2column | 1row-3column |
| 2row-1column | 2row-2column | 2row-3column |
表格的对齐方式
左对齐 右对齐 居中对齐
1row-1column 1row-2column 1row-3column
2row-1column 2row-2column 2row-3column
点击查看语法 >folded
1
2
3
4
|    左对齐    |    右对齐    |    居中对齐    |
| :---------- | ----------: | :----------: |
| 1row-1column | 1row-2column | 1row-3column |
| 2row-1column | 2row-2column | 2row-3column |

插入代码块

段落中插入代码

nextTickWork中调用process.nextTick(work),其中函数work又调用了nextTickWork

1
`nextTickWork`中调用`process.nextTick(work)`,其中函数`work`又调用了`nextTickWork`
代码块
1
2
3
4
5
6
7
8
9
10
11
12
13
class Solution {
public int countKDifference(int[] nums, int k) {
int[] cnts = new int[110];
int n = nums.length, ans = 0;
for (int i = 0; i < n; i++) {
int t = nums[i];
if (t - k >= 1) ans += cnts[t - k];
if (t + k <= 100) ans += cnts[t + k];
cnts[t]++;
}
return ans;
}
}
点击查看语法 >folded
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
```java
class Solution {
public int countKDifference(int[] nums, int k) {
int[] cnts = new int[110];
int n = nums.length, ans = 0;
for (int i = 0; i < n; i++) {
int t = nums[i];
if (t - k >= 1) ans += cnts[t - k];
if (t + k <= 100) ans += cnts[t + k];
cnts[t]++;
}
return ans;
}
}
​```

其他语法

脚注

使用 Markdown[1]可以效率的书写文档。

1
2
3
使用 Markdown[1]可以效率的书写文档。

[^1]:Markdown是一种纯文本标记语言

注释

1
<!--这是注释内容-->

Hexo中可以用<!-- more -->来分隔文章的简介和正文。

锚点

锚点能够实现文章页内的超链接。

1
2
<a href='#list'><button class="button is-info">点击跳转至列表内容</button></a>
<a name='list'>锚点</a>

公式

使用提醒

请配合MathJax插件在页面中渲染显示TeX公式。当使用Tex语法时,请使用$\\(\\)包裹行内公式,$$\\[\\]标签对包裹块状公式; 或者使用LaTeX环境。

行内公式:\(ax^2+bx+c=0\)

块状公式1:
$$\displaystyle \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\cdots} } } }$$

块状公式2:
\[f(x) = \int_{-\infty}^\infty\hat f(\xi)e^{2 \pi i \xi x}d\xi\]

使用\(\LaTeX\)环境:
\begin{equation}
A =
\begin{bmatrix}
a & b \\
c & c
\end{bmatrix}
\end{equation}

点击查看语法 >folded
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
行内公式:\\(ax^2+bx+c=0\\)

块状公式1:
$$\displaystyle \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\cdots} } } }$$

块状公式2:
\\[f(x) = \int_{-\infty}^\infty\hat f(\xi)e^{2 \pi i \xi x}d\xi\\]

使用\\(\LaTeX\\)环境:
\\begin{equation}
A =
\\begin{bmatrix}
a & b \\\\
c & c
\\end{bmatrix}
\\end{equation}

LateX公式的详细语法,请参考以下内容。

流程图

流程图直观地描述一个工作过程的具体步骤图,它使用图形表示流程思路。

点击查看语法 >folded
1
2
3
4
5
6
7
8
9
10
st=>start: 开始节点
in=>inputoutput: 输入
e=>end: 结束节点
op=>operation: 操作节点
cond=>condition: 条件节点
sub=>subroutine: 子例程
out=>inputoutput: 输出
st(right)->in->op->cond
cond(yes,right)->out->e
cond(no)->sub

画廊

Icarus的画廊插件同时包含了lightGalleryJustified Gallery两种插件。 若要启用画廊插件,请将主题配置中plugins > gallery的值设置为true。如果你使用的是Markdown语法来引用图片的话,请在HTML标签和Markdown之间添加空行使其生效。

点击查看语法 >folded
1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="justified-gallery">

![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/1.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/3.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/4.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/5.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/6.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/7.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/8.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/9.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/10.jpeg)

</div>

Bulma

Bulma 是一个基于 Flexbox 的现代化的 CSS 框架,设计的初衷就是移动优先(Mobile First),模块化设计,可以轻松用来实现各种简单或者复制的内容布局。本站主题Icarus即采用了该样式框架,在基于Markdown语法同时可搭配Bulma进行写作。注意,在使用Bulma之前,请确认是否已引入Bulma.css文件。

以下内容均参考自iMaeGoo活用 Bulma 美化 Icarus 文章

彩色突出

按钮

点击查看语法 >folded
1
2
3
4
5
6
<div class="buttons">
<button class="button is-info">Info</button>
<button class="button is-success">Success</button>
<button class="button is-warning">Warning</button>
<button class="button is-danger">Danger</button>
</div>

进度条





点击查看语法 >folded
1
2
3
4
5
<progress class="progress is-info" value="20" max="100"></progress>
<progress class="progress is-success" value="40" max="100"></progress>
<progress class="progress is-warning" value="60" max="100"></progress>
<progress class="progress is-danger" value="80" max="100"></progress>
<progress class="progress is-info" max="100"></progress>

文本块

Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如GitHubRedditDiasporaStack ExchangeOpenStreetMapSourceForge简书等,甚至还能被使用来撰写电子书

点击查看语法 >folded
1
2
3
{% raw %}<div class="notification is-success">{% endraw %}
Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如[GitHub](https://baike.baidu.com/item/GitHub/10145341)、[Reddit](https://baike.baidu.com/item/Reddit/1272010)、[Diaspora](https://baike.baidu.com/item/Diaspora/10726893)、[Stack Exchange](https://baike.baidu.com/item/Stack)、[OpenStreetMap](https://baike.baidu.com/item/OpenStreetMap/3171606) 、[SourceForge](https://baike.baidu.com/item/SourceForge/6562141)、[简书](https://baike.baidu.com/item/简书/5782216)等,甚至还能被使用来撰写[电子书](https://baike.baidu.com/item/电子书/346054)。
{% raw %}</div>{% endraw %}

Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如GitHubRedditDiasporaStack ExchangeOpenStreetMapSourceForge简书等,甚至还能被使用来撰写电子书

点击查看语法 >folded
1
2
3
{% raw %}<article class="message is-success"><div class="message-body">{% endraw %}
Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如[GitHub](https://baike.baidu.com/item/GitHub/10145341)、[Reddit](https://baike.baidu.com/item/Reddit/1272010)、[Diaspora](https://baike.baidu.com/item/Diaspora/10726893)、[Stack Exchange](https://baike.baidu.com/item/Stack)、[OpenStreetMap](https://baike.baidu.com/item/OpenStreetMap/3171606) 、[SourceForge](https://baike.baidu.com/item/SourceForge/6562141)、[简书](https://baike.baidu.com/item/简书/5782216)等,甚至还能被使用来撰写[电子书](https://baike.baidu.com/item/电子书/346054)。
{% raw %}</div></article>{% endraw %}

Markdown写作与进阶

Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如GitHubRedditDiasporaStack ExchangeOpenStreetMapSourceForge简书等,甚至还能被使用来撰写电子书

点击查看语法 >folded
1
2
3
4
5
{% raw %}<article class="message is-success"><div class="message-header">{% endraw %}
Markdown写作与进阶
{% raw %}</div><div class="message-body">{% endraw %}
Markdown为简单而生,它是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。由于Markdown的轻量化、易读易写特性,并且对于图片,图表、数学式都有支持,许多网站都广泛使用Markdown来撰写帮助文档或是用于论坛上发表消息。如[GitHub](https://baike.baidu.com/item/GitHub/10145341)、[Reddit](https://baike.baidu.com/item/Reddit/1272010)、[Diaspora](https://baike.baidu.com/item/Diaspora/10726893)、[Stack Exchange](https://baike.baidu.com/item/Stack)、[OpenStreetMap](https://baike.baidu.com/item/OpenStreetMap/3171606) 、[SourceForge](https://baike.baidu.com/item/SourceForge/6562141)、[简书](https://baike.baidu.com/item/简书/5782216)等,甚至还能被使用来撰写[电子书](https://baike.baidu.com/item/电子书/346054)。
{% raw %}</div></article>{% endraw %}

标签页

网易云音乐 是一款专注于发现与分享的音乐产品,依托专业音乐人、DJ、好友推荐及社交功能,为用户打造全新的音乐生活。

哔哩哔哩 是国内知名的视频弹幕网站,这里有最及时的动漫新番,最棒的ACG氛围,最有创意的Up主。大家可以在这里找到许多欢乐。

石墨文档 是全新一代云 Office 办公软件,支持多人在线协作编辑文档和表格,独有内容级安全,全过程留痕可追溯。PC 端和移动端全覆盖,随时随地远程办公。即写即存…

点击查看语法 >folded
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<div class="tabs is-toggle"><ul>
<li class="is-active"><a onclick="onTabClick(event)">
<span class="icon is-small"><i class="fas fa-image" aria-hidden="true"></i></span>
<span>Pictures</span>
</a></li>
<li><a onclick="onTabClick(event)">
<span class="icon is-small"><i class="fas fa-music" aria-hidden="true"></i></span>
<span>Music</span>
</a></li>
<li><a onclick="onTabClick(event)">
<span class="icon is-small"><i class="fas fa-film" aria-hidden="true"></i></span>
<span>Videos</span>
</a></li>
<li><a onclick="onTabClick(event)">
<span class="icon is-small"><i class="far fa-file-alt" aria-hidden="true"></i></span>
<span>Documents</span>
</a></li>
</ul></div>

{% raw %}<div id="Pictures" class="tab-content" style="display: block;">{% endraw %}

<div class="justified-gallery">

![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/1.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/3.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/4.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/5.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/6.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/7.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/8.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/9.jpeg)
![](https://chenspace.oss-cn-shanghai.aliyuncs.com/gallery/food/10.jpeg)

</div>

{% raw %}</div>{% endraw %}
{% raw %}<div id="Music" class="tab-content">{% endraw %}
[网易云音乐](https://music.163.com/) 是一款专注于发现与分享的音乐产品,依托专业音乐人、DJ、好友推荐及社交功能,为用户打造全新的音乐生活。
{% raw %}</div>{% endraw %}
{% raw %}<div id="Videos" class="tab-content">{% endraw %}
[哔哩哔哩](https://www.bilibili.com/) 是国内知名的视频弹幕网站,这里有最及时的动漫新番,最棒的ACG氛围,最有创意的Up主。大家可以在这里找到许多欢乐。
{% raw %}</div>{% endraw %}
{% raw %}<div id="Documents" class="tab-content">{% endraw %}
[石墨文档](https://shimo.im/) 是全新一代云 Office 办公软件,支持多人在线协作编辑文档和表格,独有内容级安全,全过程留痕可追溯。PC 端和移动端全覆盖,随时随地远程办公。即写即存...
{% raw %}</div>{% endraw %}

<style type="text/css">
.content .tabs ul { margin: 0; }
.tab-content { display: none; }
</style>

<script>
function onTabClick (event) {
var tabTitle = $(event.currentTarget).children('span:last-child').text();
$('.article .content .tab-content').css('display', 'none');
$('.article .content .tabs li').removeClass('is-active');
$('#' + tabTitle).css('display', 'block');
$(event.currentTarget).parent().addClass('is-active');
}
</script>

文字黑幕

📱:👉 有内鬼,终止交易!

点击查看语法 >folded
1
2
3
4
5
6
7
8
{% raw %}
<style type="text/css">
.heimu { color: #000; background-color: #000; }
.heimu:hover { color: #fff; }
</style>
{% endraw %}

📱:{% raw %}<span class="heimu">有内鬼,终止交易!</span>{% endraw %}

图片来源


  Hello Markdown
点击查看语法 >folded
1
2
3
4
5
<img src="https://chenspace.oss-cn-shanghai.aliyuncs.com/uPic/Hello%20Markdown.jpg" />

<a class="tag is-dark is-medium" href="https://chenspace.oss-cn-shanghai.aliyuncs.com/uPic/Hello%20Markdown.jpg" target="_blank">
<span class="icon"><i class="fas fa-camera"></i></span>&nbsp;&nbsp;Hello Markdown
</a>

以上部分语法代码块可能省略了图片缩放、文字大小等样式调整,请具体以实际调试的结果为准。


  1. 1.Markdown是一种纯文本标记语言
作者

chen

发布于

2022-06-15

更新于

2022-07-01

许可协议

CC BY 4.0

评论