DayDayUp:Markdown编辑器的简介、入门、使用方法(Markdown编辑器撰写博客)(一)

简介: DayDayUp:Markdown编辑器的简介、入门、使用方法(Markdown编辑器撰写博客)

Markdown编辑器简介


      Markdown是一种轻量级的「标记语言」,Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的HTML页面,Markdown文件的后缀名便是“.md”。


      Markdown具有一系列衍生版本,用于扩展Markdown的功能(如表格、脚注、内嵌HTML等等),这些功能原初的Markdown尚不具备,它们能让Markdown转换成更多的格式,例如LaTeX,Docbook。Markdown增强版中比较有名的有Markdown Extra、MultiMarkdown、 Maruku等。这些衍生版本要么基于工具,如Pandoc;要么基于网站,如GitHub和Wikipedia,在语法上基本兼容,但在一些语法和渲染效果上有改动。


    Markdown的语法简洁明了、学习容易,而且功能比纯文本更强,因此有很多人用它写博客。世界上最流行的博客平台WordPress和大型CMS如Joomla、Drupal都能很好的支持Markdown。完全采用Markdown编辑器的博客平台有Ghost和Typecho。用于编写说明文档,并且以“README.MD”的文件名保存在软件的目录下面。

    除此之外,由于我们有了RStudio这样的神级编辑器,我们还可以快速将Markdown转化为演讲PPT、Word产品文档、LaTex论文甚至是用非常少量的代码完成最小可用原型。在数据科学领域,Markdown已经广泛使用,极大地推进了动态可重复性研究的历史进程。




Markdown编辑器入门



标题

---------------------------

# 1级标题

## 2级标题

### 3级标题

#### 四级标题

##### 五级标题

###### 陆级标题



文本样式

---------------------------

*强调文本* _强调文本_

**加粗文本** __加粗文本__

==标记文本==

~~删除文本~~

> 引用文本

H~2~O is是液体。

2^10^ 运算结果是 1024。



列表

---------------------------

- 项目

* 项目

+ 项目

1. 项目1

2. 项目2

3. 项目3

- [ ] 计划任务

- [x] 完成任务



链接

---------------------------

链接: [link](https://mp.csdn.net).

图片: ![Alt](https://avatar.csdn.net/7/7/B/1_ralf_hx163com.jpg)

带尺寸的图片: ![Alt](https://avatar.csdn.net/7/7/B/1_ralf_hx163com.jpg =30x30)



代码片

---------------------------

下面展示一些 `内联代码片`。

```

// A code block

var foo = 'bar';

```

```javascript

// An highlighted block

var foo = 'bar';

```

1. 代码片必须手动声明代码语言类型

2. 目前支持代码类型: `markup`、`html`、`svg`、`xml`、`c`、`clike`、`cpp`、`csharp`、`java`、`vbnet`、`go`、`ruby/rb`、`python/py`、`php`、`sql`、`perl`、`objectivec`、`swift`、`javascript/js`、`css`、`handlebars`、`bash`、`kotlin`

3. 代码片主题

默认主题为:Atom One Dark

可以前往 [**写作中心/博客设置**](https://mp.csdn.net/configure) 在**代码片样式**项进行更改



表格

---------------------------

项目 | Value

-------- | -----

电脑 | $1600

手机 | $12

导管 | $1

| Column 1 | Column 2 |

|:--------:| -------------:|

| centered 文本居中 | right-aligned 文本居右 |



自定义列表

---------------------------

Markdown

: Text-to-HTML conversion tool

Authors

: John

: Luke



注脚

---------------------------

一个具有注脚的文本。[^1]

[^1]: 注脚的解释



注释

---------------------------

Markdown将文本转换为 HTML。

*[HTML]: 超文本标记语言



KaTex 数学公式

---------------------------

Gamma公式展示 $\Gamma(n) = (n-1)!\quad\forall

n\in\mathbb N$ 是通过 Euler integral

Γ(z)=∫∞0tz−1e−tdt.


新的数学公式使用了KaTex,其语法与 LaTex基本一致,但也有一些不同的地方,具体请参考KaTex官方使用文档: [https://katex.org/docs/supported.html](https://katex.org/docs/supported.html)



插入甘特图

---------------------------

```mermaid

gantt

dateFormat YYYY-MM-DD

title Adding GANTT diagram functionality to mermaid

section 现有任务

已完成 :done, des1, 2014-01-06,2014-01-08

进行中 :active, des2, 2014-01-09, 3d

计划中 : des3, after des2, 5d

```



插入UML图

------------

```mermaid

sequenceDiagram

张三 ->> 李四: 你好!李四, 最近怎么样?

李四-->>王五: 你最近怎么样,王五?

李四--x 张三: 我很好,谢谢!

李四-x 王五: 我很好,谢谢!

Note right of 王五: 李四想了很长时间, 文字太长了

不适合放在一行.

李四-->>张三: 打量着王五...

张三->>王五: 很好... 王五, 你怎么样?

```



插入Mermaid流程图

--------

```mermaid

graph LR

A[长方形] -- 链接 --> B((圆))

A --> C(圆角长方形)

B --> D{菱形}

C --> D

```



插入Flowchart流程图

-------

```mermaid

flowchat

st=>start: 开始

e=>end: 结束

op=>operation: 我的操作

cond=>condition: 确认?

st->op->cond

cond(yes)->e

cond(no)->op

```



Markdown常用语法


撤销:Ctrl/Command + Z

重做:Ctrl/Command + Y

加粗:Ctrl/Command + B

斜体:Ctrl/Command + I

标题:Ctrl/Command + Shift + H

无序列表:Ctrl/Command + Shift + U

有序列表:Ctrl/Command + Shift + O

检查列表:Ctrl/Command + Shift + C

插入代码:Ctrl/Command + Shift + K

插入链接:Ctrl/Command + Shift + L

插入图片:Ctrl/Command + Shift + G


最常见的Markdown格式选项和键盘快捷键:


输出后的效果 Markdown 快捷键

Bold **text** Ctrl/⌘ + B

Emphasize *text* Ctrl/⌘ + I

Link [title](http://) Ctrl/⌘ + K

Inline Code `code` Ctrl/⌘ + Shift + K

Image ![alt](http://) Ctrl/⌘ + Shift + I

List * item Ctrl + L

Blockquote > quote Ctrl + Q

H1 # Heading  

H2 ## Heading Ctrl/⌘ + H

H3 ### Heading Ctrl/⌘ + H (x2)

 


相关文章
|
2月前
|
Ubuntu Linux 测试技术
Linux系统之部署轻量级Markdown文本编辑器
【10月更文挑战第6天】Linux系统之部署轻量级Markdown文本编辑器
134 1
Linux系统之部署轻量级Markdown文本编辑器
|
24天前
|
人工智能 移动开发 前端开发
Markdown-to-Image:开源的在线 Markdown 转海报编辑器
Markdown-to-Image 是一款开源的在线 Markdown 转海报编辑器,能够将 Markdown 文本内容转换为图像,适用于创建社交媒体帖子、海报和其他视觉内容。该工具支持多种输出格式,并允许用户自定义样式,适用于多种应用场景。
66 4
Markdown-to-Image:开源的在线 Markdown 转海报编辑器
|
4月前
|
存储 安全 数据安全/隐私保护
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
177 0
|
3月前
|
JavaScript 前端开发 API
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
本文介绍了如何在Vue 3项目中使用v-md-editor组件库来创建markdown编辑器和预览组件。文章提供了安装步骤、如何在main.js中进行全局配置、以及如何在页面中使用VMdEditor和VMdPreview组件的示例代码。此外,还提供了一个完整示例的链接,包括编辑器和预览组件的使用效果和代码。
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
|
2月前
|
前端开发 Java 程序员
技术博客入门与Markdown技术的运用
技术博客入门与Markdown技术的运用
22 1
|
4月前
|
前端开发 Python
60行Python代码开发在线markdown编辑器
60行Python代码开发在线markdown编辑器
|
6月前
|
Linux C++ 开发者
几款主流好用的markdown编辑器介绍
几款主流好用的markdown编辑器介绍
462 0
|
6月前
Markdown编辑器--冷门实用知识总结
Markdown编辑器--冷门实用知识总结
|
7月前
|
程序员 Linux iOS开发
一款比Typora更简洁优雅的Markdown编辑器神器(完全开源免费)
一款比Typora更简洁优雅的Markdown编辑器神器(完全开源免费)
288 1
|
7月前
《使用「Markdown」编辑器的那些天 |CSDN编辑器测评》
《使用「Markdown」编辑器的那些天 |CSDN编辑器测评》
76 0