Markdown语法

一、标题

在想要设置为标题的文字前面加#来表示
一个#是一级标题，二个#是二级标题，以此类推。支持六级标题。

注：标准语法一般在#后跟个空格再写文字，博客园不加空格也行。

目录
根据文章标题层级，我们可以快速插入目录：[toc]

示例：

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

//目录语法： [toc]

这是一级标题

这是二级标题

这是三级标题

这是四级标题

这是五级标题

这是六级标题

二、字体

加粗
要加粗的文字左右分别用**或__包起来
斜体
要倾斜的文字左右分别用*或_包起来
斜体加粗
要倾斜和加粗的文字左右分别用***或___包起来
删除线
要加删除线的文字左右分别用~~包起来
标记（高亮）文本
要标记（高亮）的文字左右分别用==包起来
文字上标
要上标的文字用^包起来
文字下标
要下标的文字用~包起来
注脚
在需要注脚的文字后加[^1]和注脚的解释
注释
将需要注释的文字放在*[需要注释的文字]:注释内容内，并添加注释内容

示例：

**这是加粗的文字1**
__这是加粗的文字2__
*这是倾斜的文字1*
_这是倾斜的文字2_
***这是斜体加粗的文字1***
___这是斜体加粗的文字2___
~~这是加删除线的文字~~
==这是标记（高亮）的文字==
2^10^ === 1024
C~2~H~5~OH 是酒精的化学表达式
一个具有注脚的文本。[^1] 
[^1]: 注脚的解释。

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

这是加粗的文字1
这是加粗的文字2
这是倾斜的文字1
这是倾斜的文字2
这是斜体加粗的文字1
这是斜体加粗的文字2
~~这是加删除线的文字~~
这是标记（高亮）的文字
2¹⁰ === 1024
C₂H₅OH 是酒精的化学表达式
一个具有注脚的文本。^[1]

Markdown将文本转换为 HTML。

文字缩进
「Markdown 语言」不负责实现段首缩进，所以我们只能手写，添加空格转义符&emsp;
文字对齐（居中、左对齐、右对齐）
对于标准的markdown文本，是不支持居中对齐的。不过markdown支持html语言，所以我们采用html语法格式书写即可
文字的字体、颜色、大小及下划线
字体的属性名为face，（博客园的编辑器似乎不支持修改字体）
大小的属性名为size，size规定文本的尺寸大小，取值从 1 到 7，浏览器默认值是 3
颜色的属性名为color
下划线可以使用u标签

示例：

//文字缩进
`Math.abs(x)`
&emsp;&emsp;返回一个数的绝对值。`在这里插入代码片`
起头
//文字对齐（居中、左对齐、右对齐）
<center>此行居中</center>
// or
<p align="center">align居中</p>
<p align="left">左对齐</p>
<p align="right">右对齐</p>
//文字的字体、颜色、大小及下划线
<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>

<font color=red >红色</font>

<font size=2>我是1号字</font>
<font size=3>我是3号字</font>
<font size=7>我是7号字</font>

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

Math.abs(x)
返回一个数的绝对值。在这里插入代码片
起头

此行居中

align居中

左对齐

右对齐

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

红色

我是1号字
我是3号字
我是7号字

下划线文本

三、引用

在引用的文字前加>即可。引用也可以嵌套，如加两个>>三个>>>
n个...可以一直加下去

示例：

>这是引用的内容1
>>这是引用的内容2
>>>这是引用的内容3
>>>>>>这是引用的内容n

这是引用的内容1

这是引用的内容2

这是引用的内容3

这是引用的内容n

四、分割线

三个或者三个以上的-或者*都可以。
示例：

---
----
***
*****

效果如下：
可以看到，显示效果是一样的。

五、图片

语法：

![图片alt](图片地址 ''图片title'')

图片alt就是在图片加载失败后显示的文字，相当于对图片内容的解释。
图片title是图片的标题，当鼠标移到图片上时显示的内容。title可加可不加

示例：

![滑稽](https://pic.cnblogs.com/avatar/1958222/20200715103658.png '滑天下之大稽1')

多张图片并排显示:多个图片链接 加写，无换行，无空格
![滑稽](https://pic.cnblogs.com/avatar/1958222/20200715103658.png '滑天下之大稽1')![滑稽](https://pic.cnblogs.com/avatar/1958222/20200715103658.png '滑天下之大稽2')![滑稽](https://pic.cnblogs.com/avatar/1958222/20200715103658.png '滑天下之大稽3')

注：上传本地图片直接点击导航栏的图片标志，选择图片即可

六、超链接

语法：

[超链接名](超链接地址 "超链接title")
title可加可不加

示例：
[博客园](https://www.cnblogs.com/)

效果如下：

博客园

注：Markdown本身语法不支持链接在新页面中打开，一些平台做了处理，是可以的。如果想要在新页面中打开的话可以用html语言的a标签代替。

<a href="超链接地址" target="_blank">超链接名</a>

示例
<a href="https://www.cnblogs.com/" target="_blank">博客园</a>

七、列表

无序列表
语法：
无序列表用 - + * 任何一种都可以

- 列表内容
+ 列表内容
* 列表内容

注意：- + * 跟内容之间都要有一个空格

效果如下：

列表内容

列表内容

列表内容

有序列表

语法：
数字加点

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

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

列表内容
列表内容
列表内容

列表嵌套

上一级和下一级之间敲三个空格即可

* 列表内容1
   * 列表内容11
   * 列表内容12
   * 列表内容13
* 列表内容2
   * 列表内容21
   * 列表内容22
   * 列表内容23
* 列表内容3
   * 列表内容31
   * 列表内容32
   * 列表内容33
1. 列表内容1   
   1. 列表内容11
   2. 列表内容12
   3. 列表内容13
2. 列表内容 2
   1. 列表内容21
   2. 列表内容22
   3. 列表内容23
3. 列表内容3
   1. 列表内容31
   2. 列表内容32
   3. 列表内容33

效果如下：

列表内容1
- 列表内容11
- 列表内容12
- 列表内容13
列表内容2
- 列表内容21
- 列表内容22
- 列表内容23
列表内容3
- 列表内容31
- 列表内容32
- 列表内容33

列表内容1
1. 列表内容11
2. 列表内容12
3. 列表内容13
列表内容 2
1. 列表内容21
2. 列表内容22
3. 列表内容23
列表内容3
1. 列表内容31
2. 列表内容32
3. 列表内容33

八、表格

语法：

表头|表头|表头
---|:--:|---:
内容|内容|内容
内容|内容|内容

第二行分割表头和内容。
- 有一个就行，为了对齐，多加了几个
文字默认居左
-两边加:表示文字居中
-右边加:表示文字居右

注：原生的语法两边都要用|包起来。此处省略

示例：
姓名|技能|排行
--|:--:|--:
|刘备|哭|大哥|
|关羽|打|二哥|
|张飞|骂|三弟|

效果如下：

姓名	技能	排行
刘备	哭	大哥
关羽	打	二哥
张飞	骂	三弟

九、代码

语法：
单行代码：代码之间分别用一个反引号 ` 包起来

`代码内容`
`create database hero;`

代码块：代码之间分别用三个反引号包起来，且两边的反引号单独占一行

(```)
    function fun(){
         console.log("这是一句非常牛逼的代码");
    }；
    fun();
(```)

注：为了防止转译，前后三个反引号处加了小括号，实际是没有的。这里只是用来演示，实际中去掉两边小括号即可。

示例：
单行代码：
create database hero;

代码块：

    function fun(){
         console.log("这是一句非常牛逼的代码");
    }
    fun();

十、背景色

颜色表

点击查看代码

<table>
  <thead>
    <tr>
      <th>颜色名</th>
      <th>十六进制颜色值</th>
      <th>颜色</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td bgcolor="grey"><font color="AliceBlue">AliceBlue</font></td>
      <td bgcolor="grey"><font color="AliceBlue">F0F8FF</font></td>
      <td bgcolor="AliceBlue">rgb(240, 248, 255)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="AntiqueWhite">AntiqueWhite</font></td>
      <td bgcolor="grey"><font color="AntiqueWhite">#FAEBD7</font></td>
      <td bgcolor="AntiqueWhite">rgb(250, 235, 215)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="Lavender">Lavender</font></td>
      <td bgcolor="grey"><font color="Lavender">#E6E6FA</font></td>
      <td bgcolor="Lavender">rgb(230, 230, 250)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="LavenderBlush">LavenderBlush</font></td>
      <td bgcolor="grey"><font color="LavenderBlush">#FFF0F5</font></td>
      <td bgcolor="LavenderBlush">rgb(255, 240, 245)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color=" LightPink"> LightPink</font></td>
      <td bgcolor="grey"><font color=" LightPink">#FFB6C1</font></td>
      <td bgcolor=" LightPink">rgb(255, 182, 193)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="LightSalmon">LightSalmon</font></td>
      <td bgcolor="grey"><font color="LightSalmon">#FFA07A</font></td>
      <td bgcolor="LightSalmon">rgb(255, 160, 122)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="MintCream">MintCream</font></td>
      <td bgcolor="grey"><font color="MintCream">#F5FFFA</font></td>
      <td bgcolor="MintCream">rgb(245, 255, 250)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="MistyRose">MistyRose</font></td>
      <td bgcolor="grey"><font color="MistyRose">#FFE4E1</font></td>
      <td bgcolor="MistyRose">rgb(255, 228, 225)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="Moccasin">Moccasin</font></td>
      <td bgcolor="grey"><font color="Moccasin">#FFE4B5</font></td>
      <td bgcolor="Moccasin">rgb(255, 228, 181)</td>
    </tr>
    <tr>
      <td bgcolor="grey"><font color="PaleVioletRed">PaleVioletRed</font></td>
      <td bgcolor="grey"><font color="PaleVioletRed">#D87093</font></td>
      <td bgcolor="PaleVioletRed">rgb(216, 112, 147)</td>
    </tr>
  <tbody>
</table>

颜色名	十六进制颜色值	颜色
AliceBlue	F0F8FF	rgb(240, 248, 255)
AntiqueWhite	#FAEBD7	rgb(250, 235, 215)
Lavender	#E6E6FA	rgb(230, 230, 250)
LavenderBlush	#FFF0F5	rgb(255, 240, 245)
LightPink	#FFB6C1	rgb(255, 182, 193)
LightSalmon	#FFA07A	rgb(255, 160, 122)
MintCream	#F5FFFA	rgb(245, 255, 250)
MistyRose	#FFE4E1	rgb(255, 228, 225)
Moccasin	#FFE4B5	rgb(255, 228, 181)
PaleVioletRed	#D87093	rgb(216, 112, 147)

参考简书

注脚的解释。 ↩︎

posted @ 2022-09-17 16:35 strongerPian 阅读(31) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部