Markdown语法

顶部

简介

Markdown是一种纯文本格式的标记语言。通过简单的标记语法,它可以使普通文本内容具有一定的格式。
Markdown 的目标是实现「易读易写」
Markdown 语法的目标是:成为一种适用于网络的书写语言。
Markdown 可直接在文档中使用HTML的标签实

.md文件即为Markdown文件,现在很多前端项目中的readme等文件都是用Markdown编写的,很多企业也鼓励使用这种文件

下面讲解Markdown文件的基础语法,详细参考

Markdown基础语法

标题

前面带#号,后面带文字;一二级标签下面会有一条横线

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

效果:

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

文本格式

强调字体

一个星号(*)或者是一个下划线(_)包起来,会转换为<em>倾斜,如果是2个,会转换为<strong>加粗

*md*    
**md**
_md_   
 __md__

效果:

md
md
md
md


转义

基本上和js转义一样,\接需要转义的字符

\\
\*
\+
\-
\`
\_

效果:
\
*
+
-
`
_


删除线

用~~把需要显示删除线的字符包裹起来

~~删除~~

效果:

删除


字体、字号、颜色

Markdown本身不能设置这些,需要结合HTML标签来完成

<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>
<font color=#ff0000 size=12 face="黑体">黑体字</font>
<font color=#00ffff size=3>null</font>
<font color=gray size=5>gray</font>

效果:

我是黑体字
我是微软雅黑
我是华文彩云
黑体字
null
gray


RGB颜色对照表

列表

无序列表

使用+、-、*加一个空格,然后跟上文字就会自动生成列表

//形式一
+ a
+ b
+ c

//形式二
- d
- e
- f

//形式三
* g
* h
* i

效果:

//形式一

//形式二

//形式三


二级列表

在列表下一行前加两个空格即可生成二级列表

+ 123
    + abc
    + bcd
    + cde
+ 456
+ 789

效果:


有序列表

数字加.和一个空格,即可生成有序列表

1. abc
2. bcd
3. cde

效果:

  1. abc
  2. bcd
  3. cde

二级列表

在列表下一行前加两个空格即可生成二级列表

1. abcd
    1. abcde
    2. abcde
    3. abcde
2. bcde
3. cdef

效果:

  1. abcd
    1. abcde
    2. abcde
    3. abcde
  2. bcde
  3. cdef

嵌套列表

//无序列表嵌套
+ 123
    + abc
    1. bcd
    2. cde
+ 465
+ 789

//有序列表嵌套
1. abcd
    - abcde
    - abcde
    1. abcde
2. bcde
3. cdef

效果:

//无序列表嵌套

//有序列表嵌套

  1. abcd
    • abcde
    • abcde
    1. abcde
  2. bcde
  3. cdef

代码块

少量代码

用`包裹起来的部分

这是`一点代码`

效果:

这是``一点代码`


大量代码

用```包裹的部分,下面为了能在代码块中显示```加了\,实际没有\

\```
大量代码内容
大量代码内容
大量代码内容
\```

效果:

大量代码内容
大量代码内容
大量代码内容

引用块

>加空格,跟上文字即代表引用块

> 一级引用
>> 二级引用
>>> 三级引用
>>>> 四级引用
>>>>> 五级引用
>>>>>> 六级引用

效果:

一级引用

二级引用

三级引用

四级引用

五级引用

六级引用


链接

链接的文字放在[]中,链接地址放在随后的()中,链接也可以带title属性,链接地址后面空一格,然后用引号引起来,引号的内容不是必须的

//行内式
[我的博客](https://eonun.com "欢迎访问")来看看吧
//参数式
[我的博客]: https://eonun.com "欢迎访问"
[我的博客]来看看吧

效果:

//行内式
我的博客来看看吧
//参数式
[我的博客]: https://eonun.com "欢迎访问"
[我的博客]来看看吧


图片

和链接的形式差不多,图片的名字放在[]中,图片地址放在随后的()中,title属性(图片地址后面空一格,然后用引号引起来引号的内容不是必须的),注意的是[]前要加上!

//行内式
![我的头像](https://eonun.com/images/me.png "me")

//参数式
[我的头像]: https://eonun.com/images/me.png "me"
![我的头像]

效果:

//行内式
我的头像
//参数式

我的头像


分割线

分割线可以由* - _(星号,减号,底线)这3个符号的至少3个符号表示,注意至少要3个,且不需要连续,有空格也可以

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

效果:











表格

分割线后面的冒号表示对齐方式,写在左边表示左对齐,右边为右对齐,两边都写表示居中

//例子一
|123|234|345|
|:--|:--:|--:|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|
//例子二
|123|234|345|
|:---|:---:|---:|
|abc|bcd|cde|
|abc|bcd|cde|
|abc|bcd|cde|

效果:

//例子一

123 234 345
abc bcd cde
abc bcd cde
abc bcd cde
//例子二
123 234 345
:-- :--: --:
abc bcd cde
abc bcd cde
abc bcd cde

短路缩进(空格)

半方大的空白&#8194;看,飞碟
全方大的空白&#8195;看,飞碟
不断行的空白格&#160;看,飞碟
  段落从此开始。

效果:

半方大的空白 看,飞碟
全方大的空白 看,飞碟
不断行的空白格 看,飞碟
  段落从此开始。


页面内跳转

通过在标签中使用id定义锚点然后跳转

先定义跳转锚点

//通过span标签
<span id = "a">锚点</span>

//通过h标签
<h1 id = "1">锚点</h1>
<h3 id = "anchor">锚点</h3>

跳转

[回到顶部](#a)
[回到顶部](#1)
[回到顶部](#anchor)

效果:

回到顶部