Markdown 语法

置顶 已于 2023-05-06 10:19:58 修改
阅读量5.7k 收藏 35
点赞数 6
分类专栏： Markdown 文章标签： Markdown
于 2021-01-29 11:34:09 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_55000908/article/details/113375328
版权
基础知识：Markdown 通过简单标记语法，使普通文本内容具有一定格式。但它本身不支持修改字体、字号与颜色等功能的。
CSDN-markdown 编辑器是其衍生版本，支持基于 PageDown ( Stack Overflow）所使用的编辑器的扩展功能（如表格、脚注、内嵌HTML、内嵌 LaTeX 等等）。

html文本格式化

表情包语法

https://www.webfx.com/tools/emoji-cheat-sheet/

一、基础语法

1.1 分级标题

//用(#)号可表示 1-6 级标题:
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

1.2 字体格式

文本居中：<center>居中的文本内容</center>
下划线：<u>需要下划线的内容</u>
斜体：*斜体文本* 或 _斜体文本_ （可跨行）
粗体：**加粗文本** 或 __加粗文本__（可跨行）
删除线：~~删除文本~~
标记：==标记文本==

1.3 链接

1.3.1 行内式
[链接文字](链接地址 "链接标题") 
//链接地址与链接标题之间有一个空格
1.3.2 参考式
文中写法：[链接文字][链接标记]
文尾写法：[链接标记]:链接地址 "链接标题"
//链接地址与链接标题之间有一个空格
//如果链接文字本身可以做为链接标记，也可以写成 [链接文字][]

1.3.3 自动链接

Markdown支持以比较简短的自动链接形式来处理网址和电子邮件信箱，只要是用<>包起来，Markdown就会自动把它转成链接。一般网址的链接文字就和链接地址—样，例如:

自动网页链接：<https://www.baidu.com>
自动邮箱链接：<address@www.baidu.com>

1.4 分隔线

//用三个以上星号(*)、减号(-)、底线(_)来建立一个分隔线
*** 或 --- 或 ___

1.5 代码

1.5.1 行内代码
//用1个(`)符号包裹代码，一般在 ESC 键下方
`printf(s)`
1.5.2 多行代码
//法一：利用缩进(Tab)实现多行代码
//法二：利用3个(`)包裹实现多行代码

1.6 引用

//多层嵌套
>这是引用文字
>>这是多重引用文字
>这是一段无法跳出多层嵌套的文字
>>>这是多重引用文字

1.7 列表

1.7.1 无序列表
//使用星号(*)、加号(+)、减号(-)作为列表标记，后面要添加一个空格
* 无序列表项一
+ 无序列表项二
- 无序列表项三

无序列表嵌套有序列表
+ 无序列表项一
	1. 有序列表项一
	2. 有序列表项二
	3. 有序列表项三
 
 无序列表嵌套无序列表
- 无序列表项一
	- 嵌套无序列表项一
	- 嵌套无序列表项二
	- 嵌套无序列表项三
1.7.2 有序列表
//数字并加上(.)号来表示,后面添加一个空格
1. 有序列表项一
2. 有序列表项二
3. 有序列表项三
1.7.3 Todo 列表
//注意空格
* [x] java
* [ ] c++
- [ ] python

1.8 表格

//用(|)来分隔不同的单元格，使用(-)来分隔表头和其他行:
|  表头1   | 表头2  | 表头3 |
|  ----  | ----  | ---- |
| 单元格  | 单元格 | 单元格 |
| 单元格  | 单元格 | 单元格 |

//可以设置表格的对齐方式：
//-: 设置内容和标题栏居右对齐
//:- 设置内容和标题栏居左对齐
//:-: 设置内容和标题栏居中对齐
| 左对齐 | 右对齐 | 居中对齐 |
| :-----| ----: | :----: |
| 单元格 | 单元格 | 单元格 |
| 单元格 | 单元格 | 单元格 |

1.9 图像

Markdown图片大小对齐边框。
博文

<img src='图片地址' align='right' style=' width:300px;height:100px 
BORDER-RIGHT:#007979 5px solid；
BORDER-TOP:#007979 5px solid；
BORDER-LEFT：#007979 5px solid；
BORDER-BOTTOM:#007979 5px solid；
'/>
<table border="5"><tr>
<td><img src="https://img-blog.csdnimg.cn/c8042589a8f1424dad35e4b9a295ed7f.png"></td>
<td><img src="https://img-blog.csdnimg.cn/dc7b12d13c85437a941e7f365476d63e.png"></td>
</tr></table>

Alt：如果图片因为某些原因不能显示，就用定义的图片Alt文字来代替图片
Title：表示鼠标悬停于图片上时出现的文字

1.9.1 行内式
//语法格式：![图片Alt](图片地址 "图片Title")
![美女](https://img-blog.csdnimg.cn/img_convert/fc055b75c5d4ca3161844af3fbd3afb2.png"美女"  在这个位置进行修改)

第一种方式：
# 调整图片位置  （在地址http最后添加如下代码)
## 居中对齐：#pic_center
## 向左对齐: #pic_left
## 向右对齐: #pic_right

# 调整图大小 （在地址http最后添加=200x, 表示图像的宽200像素，高的大小会自动按比例缩放  也可以同时改变宽和高=200x300, 但是会破坏比例）
#pic_center=200x500

第二种方式：html标签
<img src="xxx" width="30%">
图片的链接地址一般形式如下：http://img~~~~.pang? 后面的不是
居中对齐：<center><img src="" width=""></center>
1.9.2 参考式
//在文档中要插入图片的位置写 ![图片Alt][标记]
//在文档的最后写上  [标记]:图片地址 "Title"
这是![美女][girl]文档

文档最后：
1. [girl]: https://img-blog.csdnimg.cn/img_convert/fc055b75c5d4ca3161844af3fbd3afb2.png "美女"
2. []:

1.10 锚点

首先创建一个跳转链接：[说明文字](#jump)
标记要跳转的位置：<span id = "jump">跳转位置</span>

1.11 注脚

//在需要添加注脚的文字后加上注脚名字：[^注脚名字]
//在文本的任意位置（一般在最后）添加注脚：[^注脚名字]: 注脚
//经测试注脚与注脚之间必须空一行
//即使你没有把注脚写在文末，经Markdown转换后，也会自动归类到文章的最后

使用Markdown[^1]可以效率的书写文档，直接转换成HTML[^2]
[^1]: Markdiown是—种纯文本标记语言

[^2]:HyperText Markup Language超文本标记语言显示效果

1.12 注释

//Markdown 的语法格式为: *[注释内容]:注释 
Markdown 将文本转换为 HTML。
*[HTML]:超文本标记语言
//使用html <abbr>标签
<p>
Hi,I am X <abbr title="I am X">IAX</abbr>.
</p>

1.13 上下标

//上标用(^)包裹内容，或用html <sup>标签
18^th^
18<sup>th</sup>
//下标用(~)包裹内容，或用html <sub>标签
H~2~O 
H<sub>2</sub>O

1.14 补充

1.14.1 换行
//发一：两个以上空格+回车
//法二：一个Enter文本换行
//法三：两个Enter段落换行
//法四：HTML标签换行 <br />
1.14.2 缩进
&nbsp;&nbsp;不断行的空白格&nbsp;或&#160;
&ensp;&ensp;半角的空白&ensp;或&#8194;
&emsp;&emsp;全角的空白&emsp;或&#8195;
1.14.3 特殊字符

💙 💘其他特殊字符，更多字符对应的Unicode码，参考网站 https://unicode-table.com/cn/

//Markdown中的语法符号，前面加反斜线 \ 即可显示符号本身。
\\ ：反斜杠
\` ：反引号
\* ：星号
\_ 	 ：下划线
\{\} ：大括号
\[\] ：中括号
\(\) ：小括号
\# ：井号
\+ ：加号
\- ：减号
\. ：英文句号
\! ：感叹号
1.14.4 生成自动目录
@[toc]

二、高级用法

2.1 LaTex 公式

以$……$形式，如 d k \sqrt{d_{k}} dk​ ​, E = m c 2 E=mc^2 E=mc2等。

2.2 流程图

详情请参考 mermaid

2.2.1 横向流程图
a=1
a=2
方形
圆角
条件a
结果1
结果2
横向流程图
2.2.2 竖向流程图
a=1
a=2
方形
圆角
条件a
结果1
结果2
竖向流程图
2.2.3 标准流程图（竖向）
Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no
2.2.4 标准流程图（横向）
Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no

2.3 时序图

详情请参考 mermaid

2.3.1 UML时序图简单样例
对象A 对象B 对象B你好吗?（请求） 对象B的描述 对象A的描述(提示) 我很好(响应) 你真的好吗？ 对象A 对象B 标题：复杂使用
2.3.2 UML时序图复杂样例
对象A 对象B 小三 C 对象B你好吗?（请求） 对象B的描述 对象A的描述(提示) 我很好(响应) 你好吗 对象B找我了 你真的好吗？ 我们是朋友 没人陪我玩 对象A 对象B 小三 C 标题：复杂使用
2.3.3 UML 标准时序图样
张三 李四 王五 王五你好吗？ 与疾病战斗 loop [健康检查] 合理 食物 看医生... 很好! 你怎么样? 很好! 张三 李四 王五 标题：复杂使用

2.4 甘特图

详情请参考 mermaid

%% 语法示例
        gantt
        dateFormat  YYYY-MM-DD
        title 软件开发甘特图
        section 设计
        需求                      :done,    des1, 2014-01-06,2014-01-08
        原型                      :active,  des2, 2014-01-09, 3d
        UI设计                     :         des3, after des2, 5d
    未来任务                     :         des4, after des3, 5d
        section 开发
        学习准备理解需求                      :crit, done, 2014-01-06,24h
        设计框架                             :crit, done, after des2, 2d
        开发                                 :crit, active, 3d
        未来任务                              :crit, 5d
        耍                                   :2d
        section 测试
        功能测试                              :active, a1, after des3, 3d
        压力测试                               :after a1  , 20h
        测试报告                               : 48h

2.5 HTML 应用

2.5.1 设置字体、字号、颜色、背景色、居中
//size：取值从1~7,浏览器默认值是3.
<font color="#0099ff" size=3 face="黑体">颜色 大小 黑体</font>
<table><tr><td bgcolor=yellow><font face="黑体"> 背景色 </font></td></tr></table>
//居中 法一：<center>居中内容</center>
//法二：<div align=center>居中内容</div>
2.5.2 设置表格
<h1>水平标题</h1>
<table border="1">
    <tr>
        <th rowspan="3">我是X</th>
        <th>Header 1</th>  <!--注释-->
        <th >Header 2</th>
    </tr> 
    <tr>      <!--<th>定义表格的表头  <tr>定义表格的行  <td>定义表格单元-->
        <td bgcolor="#FFBB66" width="100"><font color="#F0F0F0" face="黑体">row 1, cell 1</font></td>
        <td bgcolor="#5599FF" width="200"><font color="#FF8888" face="STCaiyun">row 1, cell 2</font></td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

<h2>垂直标题</h2>
<table border="1">
<tr>
 <th colspan="2">我是X</th>
</tr>
<tr>
  <th>First Name:</th>
  <td bgcolor="#5599FF"><font color="#F0F0F0" face="黑体>Bill Gates</font></td>
</tr>
<tr>
  <th>Telephone:</th>
  <td>555 77 854</td>
</tr>
<tr>
  <th>Telephone:</th>
  <td>555 77 855</td>
</tr>
</table>
2.5.3 设置图片
//Markdown 还没有办法指定图片的高度与宽度,可以使用 HUML 的 <img> 标签。
//设置图像高度：height="200px" 200像素(有无px都一样)  heght="60%" 百分比缩放
//height,width,border,hspace,vspace 的单位都是像素
<img src="图像地址" height="图像高度" width="图像宽度" border="图像边框" hspace="图像水平间距" vspace="图像垂直间距" align="相对文字的对齐方式" title="鼠标悬浮提示的文字" alt="加载错误时显示的文字" />
//align：top,middle,bottom,left,right
<div align=right><img src="http://pic11.photophoto.cn/20090626/0036036341009653_b.jpg" width="50%" height="50%"></div>

相关内容

浅红色文字：#dd0000 华文黑体：STHeiti
深红色文字：#660000 华文楷体：STKaiti
浅绿色文字：#00dd00 华文宋体：STSong
深绿色文字：#006600 华文仿宋：STFangsong
浅蓝色文字：#0000dd 黑体：SimHei
深蓝色文字：#000066 宋体：SimSun
浅黄色文字：#dddd00 新宋体：NSimSun
深黄色文字：#666600 仿宋：FangSong
浅青色文字：#00dddd 楷体：KaiTi
深青色文字：#006666 微软正黑体：Microsoft JhengHei
浅紫色文字：#dd00dd 微软雅黑体：Microsoft YaHei
深紫色文字：#660066 华文彩云：STCaiyun
字体：Helvetica Neue 颜色#FF00FF
字体：Apple Symbols 颜色：#54FF9F

文字背景色+字体颜色+字体类型
RGB颜色
常用 RGB | HTML | Markdown 颜色表

背景色的设置是按照十六进制颜色值：#FF00FF
背景色的设置是按照十六进制颜色值：#FF83FA
背景色的设置是按照十六进制颜色值：#D1EEEE
背景色的设置是按照十六进制颜色值：#C0FF3E
背景色的设置是按照十六进制颜色值：#54FF9F
背景色的设置是按照十六进制颜色值：#00AEAE
背景色的设置：Aqua rgb(0, 255, 255) #00FFFF
背景色的设置：Aquamarine rgb(127, 255, 212) #7FFFD4
背景色的设置：AntiqueWhite rgb(250, 235, 215) #FAEBD7
背景色的设置：Azure rgb(240, 255, 255) #F0FFFF
GItHub----Makedown语法学习（快速入门）
BlueAmerTJ的博客
06-01 7244
在GitHub上创建GitHub项目应该大家都会，新建的项目包含了一个 README.md 文件，这个文件的编辑就会用到Markdown的编写.接下来我将记录一下md文件从创建到编写的过程，在这个过程中就会用到Markdown语法。    一、创建一个空白GitHub项目。      在GITHub创建一个项目需要填写如上的几部分,点击“Create”这样我们就拥有了一个 GitHub
【Markdown】 语法总结
走在搬砖的路上！
12-03 5605
几乎每个 Markdown 应用程序都支持两个或多个空格进行换行，称为结尾空格（trailing whitespace）的方式，但这是有争议的，因为很难在编辑器中直接看到空格，并且很多人在每个句子后面都会有意或无意地添加两个空格。CommonMark 和其他一些轻量级标记语言允许您使用括号（)）作为分隔符（例如，1) 第一项），但并非所有 Markdown 应用程序都支持这一点，因此从兼容性的角度来看，这不是一个很好的选择。要斜体突出单词的中间部分，请在字母前后各添加一个星号，中间不要带空格。
markdown语法
全栈开发的博客
08-05 6315
Markdown是一种轻量级的标记语言，广泛用于文档编辑、博客写作和代码笔记等领域。它具有简洁、易读、易写的特点，可以方便地将文本转换为各种格式的文档。
Markdown零基础小白教程
最新发布
Aqua_chang的博客
04-04 2003
Markdown 的「入门手册」，覆盖了日常高频场景。
Markdown 语法手册 （完整整理版）
热门推荐
兔清风的博客
09-15 27万+
转载：http://blog.leanote.com/post/freewalk/Markdown%E8%AF%AD%E6%B3%95%E6%89%8B%E5%86%8C 0. 目录 0. 目录1. 斜体和粗体2. 分级标题3. 超链接 3.1. 行内式3.2. 参考式3.3. 自动链接 4. 锚点5. 列表 5.1. 无序列表5.2. 有序列表5.3
Markdown语法
weixin_30448603的博客
07-08 239
刚下了个typora编辑器，采用Markdown，一种纯文本格式的标记语言。通过简单的标记语法，它可以使普通文本内容具有一定的格式。 相比WYSIWYG编辑器 优点： 1、因为是纯文本，所以只要支持Markdown的地方都能获得一样的编辑效果，可以让作者摆脱排版的困扰，专心写作。 2、操作简单。比如:WYSIWYG编辑时标记个标题，先选中内容，再点击导航栏的标题按钮，选择几级...
Markdown 最全语法指南 —— 看这一篇就够了
流华追梦的专栏
03-20 3万+
Markdown 是一种轻量级的标记语言，它允许人们使用易读易写的纯文本格式编写文档，借助可实现快速排版且转换成格式丰富的 HTML 页面。目前被越来越多的写作爱好者及工作者使用。其语法十分简单，常用标记符号少，学习时间少，一旦掌握这种标记语言，将极大提高效率。但是若需要复杂排版如左右对齐缩进等，还是选择 Word 等专业软件。Markdown 用简洁的语法代替排版，而不像常用文字处理软件 Word 或 Pages 等进行排版、字体、插入等设置。
Markdown语法大全（超级版）.pdf
11-23
Markdown语法大全（超级版） Markdown语法大全（超级版）是Markdown语法的全面指南，涵盖了Markdown的设计理念、内联HTML语法、特殊字符自动转义、行内语法、标题、任务列表、缩进、换行、空行、对齐方式、斜体、...
Markdown语法详解PDF
01-22
Markdown语法简洁明了，适用于编写博客文章、技术文档、个人笔记等多种内容。 Markdown的基本语法包括： 1. **标题**：通过在文本前添加#来创建不同级别的标题。#的数量决定了标题的级别，例如，一个#代表一级标题...
Markdown 语法手册
04-12
Markdown语法手册详细介绍了Markdown这种轻量级标记语言的使用方法和规则。Markdown是一种用于格式化纯文本的标记语言，通过简单的标记语法，可以为普通文本内容添加格式，如斜体、粗体、标题、列表、引用、代码、...
vuemarkdown一个基于vuejs的markdown语法解析插件
08-10
vue-markdown插件支持基本的Markdown语法，包括标题、段落、粗体、斜体、代码块、链接、图片等，并且还支持一些扩展特性，如自定义渲染规则、表格、脚注等。开发者可以根据需要调整配置，例如设置代码高亮或者添加...
Makedown语法
icessun
03-11 883
maxiang.io 马克飞象专门编辑makedown语法 标题标题一标题二标题三标题四标题五标题六无序列表 无序列表 文字前面加上- 空格 文字或者* 空格 文字1号标题：# 2号标题：# caps Lock+tab键上面的，1旁边的那个键—–>出现 “ 前端工程师： html+css； Javascript； nodejs；PHP 要有空格,前面出现小黑点 vue； 微信小程序；
Markdown语法、符号、公式【Markdown】
绯樱殇雪的博客
01-08 1万+
记录Markdown的语法、符号和公式
MarkDown 语法大总结【全网汇总，从0到深大全版】
jxwd的博客
03-14 6万+
MarkDown 语法大总结【全网汇总，快速上手】(含Latex用法)【看完本文，你将从0入门到熟练掌握Markdown语法，同时也总结了不少其他文章和官网的内容】
Markdown 语法大全详解
w11111xxxl的博客
07-29 2万+
定义列表用于定义术语或概念。名词:: 定义: 更多解释定义更多解释。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值