Markdown|基本用法

关于markdown

最近接触过的很多编辑器/网站感觉都很清爽，后来知道原来是支持了markdown。关于markdown我在前几年就有听说过，但当时觉得自己用不到，以为只是html的简化版，没想到有一天也会大型真香现场~ 😂😂😂
这个博客系统的博客就是通过markdown编写的，日常记笔记也慢慢习惯使用markdown了，好的工具当然事半功倍。
在编辑器的选择上，我用过有道笔记、Typora、vscode，个人最终还是倾向使用vscode。（vscode的插件太强大了，一款编辑器搞定日常涉及到的所有计算机语言，牛批爆了~ ）
百度百科如下：

Markdown 是一种轻量级标记语言，创始人为约翰·格鲁伯（John Gruber）。 它允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的 XHTML（或者HTML）文档。这种语言吸收了很多在电子邮件中已有的纯文本标记的特性。
由于 Markdown 的轻量化、易读易写特性，并且对于图片，图表、数学式都有支持，许多网站都广泛使用 Markdown 来撰写帮助文档或是用于论坛上发表消息。 如 GitHub、Reddit、Diaspora、Stack Exchange、OpenStreetMap 、SourceForge、简书等，甚至还能被使用来撰写电子书。
优势：

  • 世界上最流行的博客平台WordPress和大型CMS如Joomla、Drupal都能很好的支持Markdown。完全采用Markdown编辑器的博客平台有Ghost和Typecho等。
  • 用于编写说明文档，以“README.md”的文件名保存在软件的目录下面。
  • Markdown可以快速转化为演讲PPT、Word产品文档甚至是用非常少量的代码完成最小可用原型。

markdown语法

基于Markdown 教程|菜鸟教程整理。

标题

使用“# ”标记1-6级标题，标题书写格式为“#”+“空格”：

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

段落样式

换行

  • 方式一：段落的换行是使用两个以上空格加上回车；
  • 方式二：段落后增加:<br>段落符

字体

*斜体文本*
_斜体文本_
*粗体文本*
_粗体文本_
*粗斜体文本*
_粗斜体文本_

分割线

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

***
—
___

删除线

只需要在文字的两端加上两个波浪线 ~~ 即可

示例：~要删除的内容~
效果：要删除的内容

下划线

下划线可以通过 HTML 的 <u> 标签来实现

示例：<u>带下划线的文本</u>
效果：带下划线的文本

脚注

创建脚注格式类似这样：社会主义核心价值观 [^1]。
[^1]: 富强、民主、文明、和谐，自由、平等、公正、法制，爱国、敬业、诚信、友善

效果：社会主义核心价值观[1]

列表

Markdown 支持有序列表和无序列表。
无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记，这些标记后面要添加一个空格，然后再填写内容：

* 第一项
+ 第二项
- 第三项

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

有序列表使用数字并加上 . 号来表示，如：

  1. 序号1
  2. 序号2

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

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

区块、代码

区块：Markdown 区块引用是在段落开头使用 > 符号 ，然后后面紧跟一个空格符号。
另外区块是可以嵌套的，一个 > 符号是最外层，两个 > 符号是第一层嵌套，以此类推。

代码：用 ``` 包裹一段代码，并指定一种语言（也可以不指定）

1
2
3
4
5
6
import time
i = 0
for i in range(0,10):
    print('hello world')
    time.sleep(2)
    i += 1

链接、图片

1
2
3
4
5
[链接名称](链接地址)

或者

<链接地址>
1
![alt 属性文本](图片地址)

表格

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

1
2
3
4
|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |

效果如下：

表头 表头
单元格 单元格
单元格 单元格

对齐方式

1
2
3
-: 设置内容和标题栏居右对齐。
:- 设置内容和标题栏居左对齐。
:-: 设置内容和标题栏居中对齐。
1
2
3
4
| 左对齐 | 右对齐 | 居中对齐 |
| :-----| ----: | :----: |
| 单元格 | 单元格 | 单元格 |
| 单元格 | 单元格 | 单元格 |
左对齐 右对齐 居中对齐
单元格 单元格 单元格
单元格 单元格 单元格

其他

HTML元素

不在 Markdown 涵盖范围之内的标签，都可以直接在文档里面用 HTML 撰写。
目前支持的 HTML 元素有：<kbd> <b> <i> <em> <sup> <sub> <br>等 ，如：

1
使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑

使用 Ctrl+Alt+Del 重启电脑

Tag便签

在 markdown 中加入如下的代码来使用便签。标签属性包括：primary、secondary、success、danger、warning、info、light
格式如下：

1
2
3
{% note success %}
测试便签success
{% endnote %}

测试便签 success

测试便签 primary

测试便签 secondary

测试便签 danger

测试便签 warning

测试便签 info

测试便签 light

数学公式

Markdown Preview Enhanced 使用 KaTeX 或者 MathJax 来渲染数学表达式。

KaTeX 拥有比 MathJax 更快的性能，但是它却少了很多 MathJax 拥有的特性。你可以查看 KaTeX supported functions/symbols 来了解 KaTeX 支持那些符号和函数。

默认下的分隔符：

1
2
$...$ 或者 \(...\) 中的数学表达式将会在行内显示。
$$...$$ 或者 \[...\] 或者 ```math 中的数学表达式将会在块内显示。

f(x)=sin(x)+12f(x)=sin(x)+12

{abcd}\begin{Bmatrix} a & b \\ c & d \end{Bmatrix}

\begin{CD} A @>a>> B \\ @VbVV @AAcA \\ C @= D \end{CD}

流程图

1、横向流程图源码格式：

graph LR
A[方形] -->B(圆角)
    B --> C{条件a}
    C -->|a=1| D[结果1]
    C -->|a=2| E[结果2]
    F[横向流程图]

2、竖向流程图源码格式：

graph TD
A[方形] --> B(圆角)
    B --> C{条件a}
    C --> |a=1| D[结果1]
    C --> |a=2| E[结果2]
    F[竖向流程图]

3、标准流程图源码格式：

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op

4、标准流程图源码格式（横向）：

1
2
3
4
5
6
7
8
9
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st(right)->op(right)->cond
cond(yes)->io(bottom)->e
cond(no)->sub1(right)->op

5、UML时序图源码样例：

1
2
3
4
5
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？

6、UML时序图源码复杂样例：

1
2
3
4
5
6
7
8
9
10
11
Title: 标题：复杂使用
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象B->小三: 你好吗
小三-->>对象A: 对象B找我了
对象A->对象B: 你真的好吗？
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩

7、UML标准时序图样例：

%% 时序图例子,-> 直线，-->虚线，->>实线箭头
  sequenceDiagram
    participant 张三
    participant 李四
    张三->王五: 王五你好吗？
    loop 健康检查
        王五->王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物 <br/>看医生...
    李四-->>张三: 很好!
    王五->李四: 你怎么样?
    李四-->王五: 很好!

8、甘特图样例：

%% 语法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI设计                     :         des3, after des2, 5d
    未来任务                     :         des4, after des3, 5d
        section 开发
        学习准备理解需求                      :crit, done, 2014-01-06,24h
        设计框架                             :crit, done, after des2, 2d
        开发                                 :crit, active, 3d
        未来任务                              :crit, 5d
        耍                                   :2d
        section 测试
        功能测试                              :active, a1, after des3, 3d
        压力测试                               :after a1  , 20h
        测试报告                               : 48h
  1. 富强民主文明和谐，自由平等公正法制，爱国敬业诚信友善

    ↩

商业转载请联系作者获得授权，非商业转载请注明出处。

Markdown
#Markdown
赏 支付宝打赏 微信打赏

如果文章对你有帮助，欢迎点击上方按钮打赏作者

Markdown|基本用法
http://hncd1024.github.io/2022/08/19/markdown基本用法/
作者
CHEN DI
发布于
2022-08-19
许可协议