CSDN Markdown使用详解

CSDN Markdown使用详解

如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。

---

1 .功能快捷键

撤销： Ctrl + Z
重做： Ctrl + Y
加粗： Ctrl + B
斜体： Ctrl + I
标题： Ctrl + Shift + H
无序列表：Ctrl + Shift + U (* / -)
有序列表：Ctrl + Shift + O (1. )
检查列表：Ctrl + Shift + C
插入代码：Ctrl + Shift + K
插入链接：Ctrl + Shift + L
插入图片：Ctrl + Shift + G

---

2.创建标题目录|列表|任务

支持6级标题,使用@[TOC]语法后生成一个完美的目录

一级标题：   行首# 空格    
二级标题:     行首# 空格    

---

列表

* 项目  
  * 项目
    * 项目
1. 项目1
2. 项目2
3. 项目3

• 项目
  • 项目
    • 项目
  1. 项目1
  2. 项目2
  3. 项目3

---

任务 
- [x] 计划任务
- [ ] 完成任务

• 计划任务
• 完成任务

---

3.分割线|高亮|引用|删除文字|引用|注释

分割线：
***

---

高亮： ==文字==   

文字

---

删除文本: ~~删除~~    

删除

---

注脚：==[^2]  
[^2]: 注脚的解释   

注脚：==¹

---

引用：  
      >  H~2~O is是液体。
      > 2^10^ 运算结果是 1024.  

H₂O is是液体。

2¹⁰ 运算结果是 1024.

---

注释:
Markdown将文本转换为 HTML。  
*[HTML]:   超文本标记语言    

Markdown将文本转换为 HTML。
*[HTML]: 超文本标记语言

---

4.字体颜色|大小|字体|背景色

我是黑体字  
我是微软雅黑  
我是华文彩云  
我是红色  
我是绿色  
我是蓝色  
我是尺寸  
我是黑体，绿色，尺寸为3
背景色：
背景色yellow
  
背景色yellow
  
背景色yellow
  

我是黑体字
我是微软雅黑
我是华文彩云
我是红色
我是绿色
我是蓝色
我是尺寸
我是黑体，绿色，尺寸为3
背景色：

背景色yellow

背景色yellow

背景色yellow

***

5.文字链接|图片超链| 索引超链|自动链接

文字链接：[链接名]（链接地址)  
[markdown语法](https://blog.csdn.net/u011419965/article/details/50536937#%E5%AD%97%E4%BD%93%E5%AD%97%E5%8F%B7%E9%A2%9C%E8%89%B2)  

markdown语法

---

 图片链接:![Alt](https://imgconvert.csdnimg.cn/aHR0cHM6Ly9hdmF0YXIuY3Nkbi5uZXQvNy83L0IvMV9yYWxmX2h4MTYzY29tLmpwZw==#pic_center)

---

索引超链接: 
I get 10 times more traffic from [Google][1] than from [Yahoo][2] or [MSN][3].  

[1]: http://google.com/        "Google" 
[2]: http://search.yahoo.com/  "Yahoo Search" 
[3]: http://search.msn.com/    "MSN Search"   

I get 10 times more traffic from Google than from Yahoo or MSN.

---

6.插入代码片

```c
static int __init sensor_init(void)
{
	int res = i2c_add_driver(&sensor_driver);
	struct proc_dir_entry *sensor_proc_entry;
	pr_info("%s: Probe name %s\n", __func__, sensor_driver.driver.name);
	if (res)
		pr_err("%s failed\n", __func__);

	sensor_proc_entry = proc_create("driver/sensor_dbg", 0660, NULL, &sensor_proc_fops);
	printk("%s\n", SENSOR_VERSION_AND_TIME);
	return res;
}
```

static int __init sensor_init(void)
{
	int res = i2c_add_driver(&sensor_driver);
	struct proc_dir_entry *sensor_proc_entry;
	pr_info("%s: Probe name %s\n", __func__, sensor_driver.driver.name);
	if (res)
		pr_err("%s failed\n", __func__);

	sensor_proc_entry = proc_create("driver/sensor_dbg", 0660, NULL, &sensor_proc_fops);
	printk("%s\n", SENSOR_VERSION_AND_TIME);
	return res;
}

---

7.UML 图表

 ```mermaid
sequenceDiagram
Title: Here is a title 
A->>B: Normal line 
B-->>C: Dashed line 
C->>D: Open arrow 
D-->>A: Dashed open arrow
 ```

A B C D Normal line Dashed line Open arrow Dashed open arrow A B C D Here is a title

---

8.FLowchart流程图

```mermaid
flowchat
st=>start: 开始
e=>end: 结束
op=>operation: 我的操作
cond=>condition: 确认？

st->op->cond
cond(yes)->e
cond(no)->op
```

Created with Raphaël 2.2.0 开始 我的操作 确认？ 结束 yes no

9.创建一个表格

一个简单的表格是这么创建的：
项目|Value
----|-----
电脑| $1600
手机  | $12
导管  | $1

项目	Value
电脑	$1600
手机	$12
导管	$1

---

* 设定内容居中、居左、居右

使用`:---------:`居中
使用`:----------`居左
使用`----------:`居右
| 第一列       | 第二列         | 第三列        |
|:-----------:| -------------:|:-------------|
| 第一列文本居中 | 第二列文本居右  | 第三列文本居左 | 

---

* SmartyPants

SmartyPants将ASCII标点字符转换为“智能”印刷标点HTML实体。例如：
|    TYPE   |ASCII                          |HTML                         
|----------------|-------------------------------|-----------------------------|
|Single backticks|`'Isn't this fun?'`            |'Isn't this fun?'            |
|Quotes          |`"Isn't this fun?"`            |"Isn't this fun?"            |
|Dashes          |`-- is en-dash, --- is em-dash`|-- is en-dash, --- is em-dash|

TYPE	ASCII	HTML
Single backticks	'Isn't this fun?'	‘Isn’t this fun?’
Quotes	"Isn't this fun?"	“Isn’t this fun?”
Dashes	-- is en-dash, --- is em-dash	– is en-dash, — is em-dash

---

10.KaTeX数学公式

您可以使用渲染LaTeX数学表达式 [KaTeX](https://khan.github.io/KaTeX/):

Gamma公式展示 $\Gamma(n) = (n-1)!\quad\forall
n\in\mathbb N$ 是通过欧拉积分
$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

您可以使用渲染LaTeX数学表达式 KaTeX:

Gamma公式展示 $\Gamma (n)=(n-1)!\forall n\in \mathbb{N}$ 是通过欧拉积分
$$\Gamma (z)={\int }_0^{\infty }{t}^{z-1}{e}^{-t}dt.$$

你可以找到更多关于的信息 LaTeX 数学表达式here.

---

11.新的甘特图功能，丰富你的文章

```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
        计划二               :         des4, after des3, 5d
```

Mon 06 Mon 13 Mon 20 已完成 进行中 计划一 计划二 现有任务 Adding GANTT diagram functionality to mermaid

---

参考文档
1: http://meta.math.stackexchange.com/questions/5020/mathjax-basic-tutorial-and-quick-reference
2: https://mermaidjs.github.io/
3: https://mermaidjs.github.io/
[4]: http://adrai.github.io/flowchart.js/
[5]: https://blog.csdn.net/u011419965/article/details/50536937#2-分割线
[6]: https://www.cnblogs.com/tocy/p/markdown-footnote_link.html

---

1. 注脚的解释 ↩︎