MarkDown语法教程

本教程主要整理我在学习markdown的一些知识点,互联网上找到的一些小知识,纯手打,分节参考自菜鸟教程。会不定期更新。

简介

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

Markdown 编写的文档可以导出 HTML 、Word、图像、PDF、Epub 等多种格式的文档。

Markdown 编写的文档后缀为 .md, .markdown


编辑器

市面上我们可以找到很多 Markdown 编辑器,比如 Typora、MacDown、Bear、MarkdownPad、MarkdownX、JetBrains’s IDE(需要安装插件)、Atom、简书、CSDN 以及 GitBook 自家的 GitBook Editor 等等。

标题

Markdown 可以在文字前加 # 的方式设置标题。

一个#是一级标题,两个#是二级标题,以此类推。支持六级标题。

注:标准语法要求在#和标题文字之间加一个空格。

示例:

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

展示效果如下:

这是一级标题

这是二级标题

这是三级标题

这是四级标题
这是五级标题
这是六级标题


二、字体与格式

字体

markdown支持设置字体为加粗、斜体、斜体加粗以及删除线等格式

  • 斜体

    要加粗的文字左右分别用一个 * 号或 _ 包起来

  • 加粗

    要倾斜的文字左右分别用两个*号或 _ 包起来

  • 斜体加粗

    要倾斜和加粗的文字左右分别用三个*号或 _ 包起来

  • 删除线

    要加删除线的文字左右分别用两个~~号包起来

示例:

*斜体文本*
_斜体文本_
**粗体文本**
__粗体文本__
***粗斜体文本***
___粗斜体文本___
~~这是加删除线的文字~~

展示效果如下:

这是加粗的文字
这是倾斜的文字`
这是斜体加粗的文字
这是加删除线的文字


下划线

下划线可以通过 HTML 的 标签来实现:

<u>带下划线文本</u>

展示效果如下:

带下划线文本


脚注

Markdown 脚注的格式如下:

[^要注明的文本]

创建脚注格式类似这样 [^test]。

[^test]: 测试脚注,鼠标移动到脚注时会显示,类似html的title属性

创建脚注格式类似这样 1 ,由于编辑器原因,脚注放在了在文章末尾。


格式

1.换行

Markdown 段落没有特殊的格式,直接编写文字就好。对段落换行有以下两种形式:

  • 在段落末尾添加两个以上空格加上回车

  • 使用一个空白的空行

2.分隔线

通过在一行中用三个以上的星号、减号、下划线来建立一个分隔线,行内不能有其他东西。你也可以在星号或是减号中间插入空格。下面每种写法都可以建立分隔线:

***
* * *
- - -
----------
_ _ _
___


三、链接及图片

链接

markdown有两种方式使用链接。

[链接名称](链接地址)

或者

<链接地址>

代码如下:

[百度一下](www.baidu.com)

或者直接使用链接地址

<www.baidu.com>  
注:csdn的编辑器貌似不支持这种

展示效果如下:

百度一下
<www.baidu.com>

也可以使用html语言的a标签代替。

<a href="https://baidu.com" target="_blank">baidu</a>

展示效果如下:

baidu


变量链接

链接也可以用变量来代替,文档末尾附带变量地址:

这个链接用 1 作为网址变量 [Baidu][1]

在文档的结尾为变量赋值(网址)
[1]: http://www.baidu.com/
  

展示效果如下:

这个链接用 1 作为网址变量 Baidu


图片

Markdown 图片语法格式如下:

![alt 属性文本](图片地址)

![alt 属性文本](图片地址 "可选标题")

代码如下:

![点赞图标](https://i-blog.csdnimg.cn/blog_migrate/6cc5e80f8af9eb506d4f149c8e303ffa.png)

![点赞图标](https://i-blog.csdnimg.cn/blog_migrate/6cc5e80f8af9eb506d4f149c8e303ffa.png "这是一个赞")

正常图片:
在这里插入图片描述
有title属性的图片:
点赞图标

Markdown 还没有办法指定图片的高度与宽度,如果你需要的话,你可以使用普通的 <img> 标签。

<img src=".\img\likered.png" width="10%">

注:csdn编辑器支持设置图片位置及大小

带尺寸的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif =30x30)

居中的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif#pic_center)

居中并且带尺寸的图片: ![Alt](https://i-blog.csdnimg.cn/blog_migrate/2c5626d1121945cb84be5bc1cdd2de45.gif#pic_center =30x30)

带尺寸的图片: Alt

居中的图片: Alt

居中并且带尺寸的图片: Alt



四、列表

Markdown 支持有序列表和无序列表。


无序列表

无序列表使用星号(*)、加号(+)或是减号(-)作为列表标记:

代码如下:

* 第一项
* 第二项
* 第三项

+ 第一项
+ 第二项
+ 第三项


- 第一项
- 第二项
- 第三项

展示效果如下:

  • 第一项

  • 第二项

  • 第三项


有序列表

有序列表使用数字并加上 . 号来表示。

注:序号跟内容之间要有空格

代码如下:

1. 列表内容
2. 列表内容
3. 列表内容

展示效果如下:

  1. 列表内容
  2. 列表内容
  3. 列表内容

列表嵌套

列表嵌套只需在子列表中的选项添加三或四个空格即可:

代码如下:

1. 第一项:
    - 第一项嵌套的第一个元素
    - 第一项嵌套的第二个元素
2. 第二项:
    - 第二项嵌套的第一个元素
    - 第二项嵌套的第二个元素

展示效果如下:

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

多级嵌套,只需在下一级比上一级多两个空格

  1. 第一项:
    • 第一项嵌套的第一个元素
      • 第一项嵌套的第二个元素
        • 第一项嵌套的第三个元素


五、区块


引用

区块引用是在段落开头使用 > 符号 ,然后后面紧跟一个空格符号:

> 区块引用1
> 区块引用2
> 区块引用3

区块引用1
区块引用2
区块引用3


嵌套引用

区块是可以嵌套的,一个 > 符号是最外层,两个 > 符号是第二层嵌套,以此类推:

> 第一层
> > 第二层嵌套
> > > 第三层嵌套

展示如下:

第一层

第二层嵌套

第三层嵌套


列表中使用区块

其实就是在引用前添加缩进,使结构看起来像是在列表项目内放进区块,只需在 > 前添加四个空格的缩进即可。

代码如下:

* 第一项
    > 缩进区块1
    > 缩进区块2
* 第二项
  • 第一项

    缩进区块1
    缩进区块2

  • 第二项

代码

段内代码(单行代码)

如果是段落内的片段的代码可以用反引号把它包起来(`),例如:

这是一个`printf()` 函数

显示结果如下:

这是一个printf() 函数

代码区块

可以用 ``` 包裹一段代码,并指定一种语言(也可以不指定):

注:上下两边的反引号单独占一行

代码如下:

```javascript
$(document).ready(function () {
    alert('hello world');
});
```

展示效果如下:

$(document).ready(function () {
    alert('hello world');
});


六、表格

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

语法格式如下:

|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |

注:- 有一个就行,为了对齐,可以多加几个

展示效果如下:

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

对齐方式

markdown文字默认居左,csdn默认居中。可以设置单元格内容的对齐方式:

  • -: 设置内容和标题栏居右对齐。

  • :- 设置内容和标题栏居左对齐。

  • :-: 设置内容和标题栏居中对齐。

语法格式如下:

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

展示效果如下:

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

七、进阶

支持 HTML 元素

不在 Markdown 涵盖范围之内的标签,都可以直接在文档里面用 HTML 撰写。

目前支持的 HTML 元素有:<kbd> <b> <i> <em> <sup> <sub> <br>等 ,如:

使用 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>Del</kbd> 重启电脑
<b>b元素</b>
<i>i元素</i>
<em>em元素</em>
元素<sup>sup</sup>
元素<sub>sub</sub>

展示效果如下:

使用 Ctrl+Alt+Del 重启电脑

b元素
i元素
em元素
元素sup
元素sub


转义

Markdown 支持使用反斜杠+特殊字符的形式表示转义特殊字符:

\   反斜线
`   反引号
*   星号
_   下划线
{}  花括号
[]  方括号
()  小括号
#   井字号
+   加号
-   减号
.   英文句点
!   感叹号

以下是脚注部分:


  1. 测试脚注,鼠标移动到脚注时会显示,类似html的title属性 ↩︎

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值