[编程]-Markdown格式文件的学习-入门_markdown样式文件-CSDN博客

本文链接：https://blog.csdn.net/zhongfeiying_cx/article/details/117835954

Markdown是什么

Markdown 是一种轻量级标记语言，创始人为约翰·格鲁伯（John Gruber）。它出发点就是使用易读易写的纯文本格式编写文档，然后转换成有效的HTML文档。这种语言吸收了纯文本标记的特性。Markdown 的目标是实现「易读易写」。最大灵感来源是纯文本电子邮件的格式。

Markdown语法的目标就是成为一种适用于网络的书写语言，它不是想要取代HTML，只是抽取小集合的HTML标记，让文档在一般美观的情景下，方便容易写出需要的文档。

正是因为Markdown的这些特点，而且功能比纯文本更强，因此有很多人用它写博客。世界上最流行的博客平台WordPress和大型CMS如joomla、drupal都能很好的支持Markdown。当然我们CSDN也是支持的！在编辑文字时可以直接使用。

Markdown需要编辑器吗？！

自问一下，对于程序员，应该就是Vim或者随便一个编辑器就够了，还要用Typora吗？还有带即时渲染的Markdown编辑器有：Atom，Sublime Text等，这就看你的习惯了，对于牛的程序员，就是喜欢黑屏搞定一切！就可以背一下md的语法，直接用文本写就可以。对于普通的程序员，比如我，可能用Tpyora编辑，一会用用源码，一会用用快捷键，看看效果，放心了！

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YclsK9fw-1623451165204)(markdown/assets/image-20210611102049225.png)]

Markdown主要命令介绍

1. 标题

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

2. 段落

分段落
段落的换行利用空行来表示，也可以使用两个以上空格加上回车。
字体：

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

分隔线:

***
或
----------

显示效果：

3. 列表

列表分为有序列表和无序列表。

无序列表可以用* ， + ， — 来创建。在解析中转换成了ul>li
有序列表就是数字后面的点只能是英文的点来表示。

* 第一章
* 第二章
* 第三章

效果就是这样：

第一章
第二章
第三章

1. 第一章
2. 第二章
3. 第三章

效果就是这样：

第一章
第二章
第三章

4. 区块

* 吾日三省吾身     
   >这是曾子说的

效果就是这样：

吾日三省吾身

这是曾子说的

5. 代码

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

```javascript
$(document).ready(function () {
    alert('你好！');
});
```

效果就是这样：

$(document).ready(function () {
    alert('你好！');
});

6. 图片

![图片等待加载](/imgs/flower.jpg)

上面的语法对应下面的语法：

<img src="/imgs/beafsteak.jpg"  alt="牛排等待中" />

在这里插入图片描述

src是文件的路径，alt是img的必需属性，是定义在图像无法显示时的替代文本。

7. 表格

| 表头   | 表头   | 表头 |
|:------|:------:|------:|
| 左对齐 | 居中对齐 | 右对齐|
| 单元格 | 单元格 | 单元格|

表格的显示效果就是这样：

表头	表头	表头
左对齐	居中对齐	右对齐
单元格	单元格	单元格

利用：来设置对齐方式。

8. HTML元素

目前支持的 HTML 元素有： ^{_{<br> 等}}

使用的显示效果： Ctrl+C拷贝文件

使用的显示效果： 这是粗体文本

使用的显示效果： 这是斜体文本

使用的显示效果： 表示为强调的文本

使用^{的显示效果： ^{这是上标文本}}

使用_{的显示效果： _{这是下标文本}}

使用<br>的显示效果：
我要换行了！

10. 图形

利用美人鱼mermaid来实现各种流程图、时序图、甘特图等，这些满足我们日常所用了。

\```mermaid
graph TD;
    id1[start/index.html]-->|调用|src/index.js; 
    src/index.js-->src/config.js;
    src/index.js-->lib/admin.js;
    src/index.js-->lib/view.js;
    src/index.js-->src/views/layout.js;
	src/index.js-->src/views/index.html;
\```