Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。
— 摘自百度百科

以下记录了markdown额外的小技巧,markdown基本语法指路: Markdown编辑器常用语法使用指南

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

1.1 语法格式:
|  表头   | 表头  |
|  ----  | ----  |
| 单元格  | 单元格 |
| 单元格  | 单元格 |
表头表头
单元格单元格
单元格单元格
1.2 对齐方式
  • -: 设置内容和标题栏居右对齐。
  • :- 设置内容和标题栏居左对齐。
  • :-: 设置内容和标题栏居中对齐。

实例如下:

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

markdown现在还不支持单元格合并,想要合并表格只能迂回进行:

  1. 从word或excel中复制表格
  2. 打开链接: No-Cruft Excel to HTML TableConverter
  3. 贴上复制的文字,然后按convert,就会得到这个表格的html代码
  4. 将html代码贴到markdown编辑器

方法二(嵌入HTML代码):

  1. 可以先用Markdown语法生成未合并单元格的HTML代码
  2. 进行修改, 增加rowspan或colspan属性来实现合并单元格
  3. 再把更改后的HTML代码粘贴到markdown文件中
2.1 文字缩进

「Markdown 语言」不负责实现段首缩进,所以我们只能手写,添加空格转义符,前端HTML空格转义符总结

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

效果如下,成功缩进两字符
Math.abs(x)
  返回一个数的绝对值。

2.2 文字对齐(居中、左对齐、右对齐)

对于标准的markdown文本,是不支持居中对齐的。不过markdown支持html语言,所以我们采用html语法格式书写即可。
居中:

<center>此行居中</center>
// or
<p align="center">align居中</p>

align居中

<p align="left">左对齐</p>
<p align="right">右对齐</p>
2.3 文字的字体及颜色
2.3.1 字体更换

同样我们也需要遵照其标准的语法格式

<font face="黑体">我是黑体字</font>
<font face="微软雅黑">我是微软雅黑</font>
<font face="STCAIYUN">我是华文彩云</font>

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

2.3.2 大小更换

大小的属性名为size,Size规定文本的尺寸大小,取值从 1 到 7,浏览器默认值是 3。

<font face="黑体" size=2>我是黑体2号字</font>
<font face="黑体" size=3>我是黑体3号字</font>
<font face="黑体" size=7>我是黑体7号字</font>

我是黑体2号字
我是黑体3号字

我是黑体7号字

2.3.3 颜色替换

在html语言中,颜色属性名为color,所以可以表示如下

<font color=red size=72>红色</font>
2.4 文字添加下划线

使用html标签:<hr/>

用爱劈开黑暗,像一道曙光,
是非真假无法判断,不如坚强。

用爱劈开黑暗,像一道曙光,


是非真假无法判断,不如坚强。
  1. 使用u标签
<u>下划线文本</u>

效果:
下划线文本

3.1 背景色
<table>
  <tbody>
    <th>颜色名</th>
    <th>十六进制颜色值</th>
    <th>颜色</th>
    <td><font color="AliceBlue">AliceBlue</font></td>
    <td><font color="AliceBlue">F0F8FF</font></td>
    <td bgcolor="AliceBlue">rgb(240, 248, 255)</td>
    <td><font color="AntiqueWhite">AntiqueWhite</font></td>
    <td><font color="AntiqueWhite">#FAEBD7</font></td>
    <td bgcolor="AntiqueWhite">rgb(250, 235, 215)</td>
    <td><font color="Lavender">Lavender</font></td>
    <td><font color="Lavender">#E6E6FA</font></td>
    <td bgcolor="Lavender">rgb(230, 230, 250)</td>
    <td><font color="LavenderBlush">LavenderBlush</font></td>
    <td><font color="LavenderBlush">#FFF0F5</font></td>
    <td bgcolor="LavenderBlush">rgb(255, 240, 245)</td>
    <td><font color=" LightPink"> LightPink</font></td>
    <td><font color=" LightPink">#FFB6C1</font></td>
    <td bgcolor=" LightPink">rgb(255, 182, 193)</td>
    <td><font color="LightSalmon">LightSalmon</font></td>
    <td><font color="LightSalmon">#FFA07A</font></td>
    <td bgcolor="LightSalmon">rgb(255, 160, 122)</td>
    <td><font color="MintCream">MintCream</font></td>
    <td><font color="MintCream">#F5FFFA</font></td>
    <td bgcolor="MintCream">rgb(245, 255, 250)</td>
    <td><font color="MistyRose">MistyRose</font></td>
    <td><font color="MistyRose">#FFE4E1</font></td>
    <td bgcolor="MistyRose">rgb(255, 228, 225)</td>
    <td><font color="Moccasin">Moccasin</font></td>
    <td><font color="Moccasin">#FFE4B5</font></td>
    <td bgcolor="Moccasin">rgb(255, 228, 181)</td>
    <td><font color="MintCream">MintCream</font></td>
    <td><font color="MintCream">#F5FFFA</font></td>
    <td bgcolor="MintCream">rgb(245, 255, 250)</td>
    <td><font color="PaleVioletRed">PaleVioletRed</font></td>
    <td><font color="PaleVioletRed">#D87093</font></td>
    <td bgcolor="PaleVioletRed">rgb(216, 112, 147)</td>
</table>
颜色名十六进制颜色值颜色
AliceBlueF0F8FFrgb(240, 248, 255)
AntiqueWhite#FAEBD7rgb(250, 235, 215)
Lavender#E6E6FArgb(230, 230, 250)
LavenderBlush#FFF0F5rgb(255, 240, 245)
LightPink#FFB6C1rgb(255, 182, 193)
LightSalmon#FFA07Argb(255, 160, 122)
MintCream#F5FFFArgb(245, 255, 250)
MistyRose#FFE4E1rgb(255, 228, 225)
Moccasin#FFE4B5rgb(255, 228, 181)
MintCream#F5FFFArgb(245, 255, 250)
PaleVioletRed#D87093rgb(216, 112, 147)
4.1 设置图片大小

markdown默认情况下图片是自适应大小的,宽度充满,类似于max-width: 100%。你一定在插入图片的时候,遇到图片太大,影响观感的问题,或者遇到过我们需要将图片只显示半边的需求。
在这里插入图片描述
高清1
Markdown中,图片大小的设定方式有两种
不通过[](url)这种格式上传图片,用<img>标签替换。

  1. 设置zoom
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307552342&di=f5567b6e4490ee2ac89555ceaefeaf67&imgtype=0&src=http%3A%2F%2Ffile.mumayi.com%2Fforum%2F201401%2F16%2F231735cfp4046206r4i705.jpg"  style="zoom: 33%;" />
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307552342&di=f5567b6e4490ee2ac89555ceaefeaf67&imgtype=0&src=http%3A%2F%2Ffile.mumayi.com%2Fforum%2F201401%2F16%2F231735cfp4046206r4i705.jpg"  style="zoom: 25%;" />
 这种方式,是通过html标签引入,通过指定css样式来实现调整图片尺寸的的,你还可以通过内联样式. 
  1. 设置style中的width
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307552342&di=f5567b6e4490ee2ac89555ceaefeaf67&imgtype=0&src=http%3A%2F%2Ffile.mumayi.com%2Fforum%2F201401%2F16%2F231735cfp4046206r4i705.jpg" width="200px" />

或者这样的css样式

<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307552342&di=f5567b6e4490ee2ac89555ceaefeaf67&imgtype=0&src=http%3A%2F%2Ffile.mumayi.com%2Fforum%2F201401%2F16%2F231735cfp4046206r4i705.jpg" style="width:200px" />
4.2 多张图片并排显示

在markdown中,目前,让图片像这样并排居中的方式主要是两种:

  1. ![](url1)![](url1)![](url1)...多个图片链接綴加写,无换行,无空格。

这种方式,似乎并不能够每一次都生效。但在CSDN是可以生效的,如下:

<center>
![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly90aW1nc2EuYmFpZHUuY29tL3RpbWc_aW1hZ2UmcXVhbGl0eT04MCZzaXplPWI5OTk5XzEwMDAwJnNlYz0xNTk1MzA3NTA5NjA1JmRpPTdlMjVhY2I3NTVhMzQ5MmY2MmExMWVkOWNhZjE5MmViJmltZ3R5cGU9MCZzcmM9aHR0cCUzQSUyRiUyRmEyLmF0dC5odWRvbmcuY29tJTJGMzYlMkY0OCUyRjE5MzAwMDAxMzU3MjU4MTMzNDEyNDg5MzU0NzE3LmpwZw?x-oss-process=image/format,png)![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly90aW1nc2EuYmFpZHUuY29tL3RpbWc_aW1hZ2UmcXVhbGl0eT04MCZzaXplPWI5OTk5XzEwMDAwJnNlYz0xNTk1MzA3NTA5NjA1JmRpPTdlMjVhY2I3NTVhMzQ5MmY2MmExMWVkOWNhZjE5MmViJmltZ3R5cGU9MCZzcmM9aHR0cCUzQSUyRiUyRmEyLmF0dC5odWRvbmcuY29tJTJGMzYlMkY0OCUyRjE5MzAwMDAxMzU3MjU4MTMzNDEyNDg5MzU0NzE3LmpwZw?x-oss-process=image/format,png)
</center>

这种方式的很大问题是,图片是紧密贴在一起的,观感并不友好,因此不支持使用该方式。
  1. 使用html标签<figure>
<center>
<figure>
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307533075&di=6f4081a42a6dd1ef3ada1eef2f86f2fb&imgtype=0&src=http%3A%2F%2Fa0.att.hudong.com%2F56%2F12%2F01300000164151121576126282411.jpg" width="30%"/>
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1595307533075&di=6f4081a42a6dd1ef3ada1eef2f86f2fb&imgtype=0&src=http%3A%2F%2Fa0.att.hudong.com%2F56%2F12%2F01300000164151121576126282411.jpg"  width="30%"/>
</figure>
</center>

当你在使用第二种方式的时候你一定需要注意的几点:
  1. 在博客园中写博客时,代码块和上方文字要空一行才会生效,如下:
    在这里插入图片描述
  2. 当你使用<center>标签单独居中一张图片的时候,开标签和图片代码不要空一行,才会正常显示居中(CSDN中),否则会居左
    不差
  3. 当你在应用这种方式不成功的时候,很可能是图片过大,这时候你需要在图片的链接中加入图片参数以设定合适的尺寸。比如我在上面的图片中添加了width="30%",否则一行只能显示一张图片。

如果你觉得这篇文章有用,动动小手给我点个赞吧🍀

4. 设置颜色、字号、字体 5. 设置背景色高亮。 1.设置为markdown格式。如下图红框所示,正常写代码的时候是代码形式,要先设置为“markdown”【我这显示的是中文,就是“标记”】。 2.设置标题。 如下图所示。注意,“#”与文字之间需要有空格 # 这是一级标题 ## 这是二级标题 ### 这是三级标题 #### 这是四级标题 ##### 这是五级标题 ###### 这是六级标题 这是效果: 这是一级标题
CSDN的markdown编辑器是其衍生版本,扩展了Markdown的功能(如表格、脚注、内嵌HTML等等)就是内嵌HTML,接下来要讲的功能就需要使用内嵌HTML的方法来实现。一、颜色浅红色文字:<font color="#dd0000">浅红色文字:</font><br /> 深红色文字:<font color="#660000">深红色文字</font><br /> 浅绿色文字:<font
markdown语法主要考虑的是英文,所以对于中文的首行缩进并不太友好,可以采用以下方法,实现首行缩进。 1、把输入法由半角改为全角。 两次空格之后就能够有两个汉字的缩进。 2、输入下面的代码,然后紧跟着输入文本即可。注意后面跟着分号。 半角的空格: 半方大的空白&ensp;或&#8194; 全角的空格: 全方大的空白&emsp;或&#8195; 不断行的空格: 不断行的空白格&nbsp;或&#160; .........
Markdown 启发的代码使用缩进和标题等简单提示将办公文档转换为干净的 HTML 我们有什么在这里? tools/w2html5是 Javascript 代码,可以清理 Word 和 OpenOffice 系列生成的 HTML 文档并将它们转换为漂亮的 HTML5 - 可以在浏览器中运行,但设计为通过 phantomjs 在熄灯模式下运行 tools/commandline包含一个 python 脚本来自动化转换 .doc(x) 的过程? 成 HTML 感谢网友码飞_CC的帮助,看了好多遍他的博客,还是没有完全记住,所以这里要Mark一下~原文链接如下:https://www.jianshu.com/p/31eade263e7a 今天在学习深度神经网络∼ 今天在用Markdown写笔记的时候,需要空两格,也就是相当于中文中每个自然段首行的缩进,这个不是很会,于是咨询了一下度娘∼ 3 Markdown的中文缩进(空格两个字符)
Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。 Markdown具有一系列衍生版本,用于扩展Markdown的功能(如表格、脚注、内嵌HTML等等),这些功能原初的Markdown尚不具备,它们能让Markdown转换成更多的格式,例如LaTeX,Docbook。Markdown增强版中比较有名的有Markdown Extra、MultiMarkdown、 Maruku等。这些衍生版本要么基于工具,如Pandoc;要么基于网站,如GitHub和Wikipedia,在语法上基本兼容,但在一些语法和渲染效果上有改动。 上传到CSDN主要为了做个备份,方便以后下载安装,有需要的可以进行下载。
要在Markdown中实现文字居中,可以使用HTML标签来实现。可以在文本中插入<center>标签,并将要居中的文字放在标签中间,如"<center>要居中的文字</center>"。确保在标签前后加上空格,以防止标签被浏览器解析。这样就可以使文字Markdown中居中显示。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [markdown怎么居中文本](https://blog.csdn.net/jal517486222/article/details/82957764)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [Markdown语法(实现首行缩进和图片居中)](https://blog.csdn.net/qq_46067306/article/details/124081905)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [Markdown常用方法总结](https://download.csdn.net/download/weixin_38725137/13739619)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]