markdown几点使用小技巧

Markdown 是一种轻量级的「标记语言」,目前也被越来越多的写作爱好者、撰稿者广泛使用。请不要被「标记」、「语言」所迷惑,Markdown 的语法十分简单,常用的标记符号也不超过十个,这种相对于更为复杂的 HTML 标记语言来说,Markdown 可谓是十分轻量,学习成本也不需要太多,且一旦熟悉这种语法规则,会有一劳永逸的效果。

这里列举的都是除了Markdown标准语法外一些平时不多见的小技巧,非常实用,可以先学习标准语法再把这个作为补充,如下技巧大多是利用 Markdown 兼容部分 HTML 标签的特性来完成,不一定在所有网站和软件里都完全支持,主要以 GitHub 支持为准.

制作能跳转的目录

语法格式: [条目名称](#id), id是要跳转的目的地的id, 我们必须在目的地处设置与此id相同的id.

例如: 我们要跳转到在表格单元格里换行这个地方.

第一步: 设置目录:通过[条目名称](#id)语法设置目录. 在表格单元格里换行;

第二步: 设置跳转目的地:在目的地处通过<h3 id="destinationID"></h3>设置与第一步相同的id(<h3></h3>是3级标题对应markdown语法的###).

完成以上两步之后就能点击第一步设置的目录进行跳转. 试一试吧.

能展开折叠的下拉列表

点击我进行切换展开折叠状态 1. 内容一. 2. 内容二. 3. 内容三.
默认展开的列表 1. 内容一. 2. 内容二. 3. 内容三.

在段落中插入图片, 并给图片添加点击跳转事件

案例如下:

捐款Donate.谢谢啦

精准跳转文中任意位置

在目标位置前一行添加标签 ,id值随便写,保持全文唯一性就行,跳转就是靠id识别。 在跳转发起的地方设置跳转链接,格式为 [显示文字](#第1步的id号) 示例代码:

在表格单元格里换行

行首缩进

直接在 Markdown 里用空格和 Tab 键缩进在渲染后会被忽略掉,需要借助 HTML 转义字符在行首添加空格来实现,&ensp; 代表半角空格,&emsp; 代表全角空格。

缩进两个汉字示例代码:

    春天来了,又到了万物复苏的季节。

字体-字号-颜色-背景色

Markdown本身不支持修改字体、字号与颜色等功能,但是因为Markdown兼容HTML语法,所以我们可以使用HTML标签来设置。

  • face 表示字体;
  • color 表示颜色,可取十六进制的值;
  • size 表示字号,但是要注意取值范围是 1 - 7,浏览器的默认值是 3;
  • bgcolor 表示背景颜色,需借助 table, tr, td 等表格标签来使用;

示例代码:

我是微软雅黑

颜色是红色 字号为<font color=#0099ff size=7>7号</font>

背景色是:orange

分割线

可以在一行中用 3 个以上的* 或 - 或 _来建立一个分隔线,行内不能有其他东西,为了兼容其他平台,可以在符号中间插入空格。

示例代码:




图文混排

使用 标签来贴图,然后指定 align 属性。

示例代码:

这是一个示例图片。

图片显示在 N 段文字的右边。

N 与图片高度有关。

刷屏行。

刷屏行。

控制图片大小和位置

标准的 Markdown 图片标记 ![]() 无法指定图片的大小和位置,只能依赖默认的图片大小,默认居左。

而有时候源图太大想要缩小一点,或者想将图片居中,就仍需要借助 HTML 的标签来实现了。图片居中可以使用 <div> 标签加 align 属性来控制,图片宽高则用 width 和 height 来控制。

示例代码:

图片默认显示效果:

加以控制后的效果:

还可以只设置图片的宽度或者高度来达到等比缩放的目的:

在表格单元格里换行

在表格单元格里换行用 HTML 里的
实现。

示例代码:

Header1 Header2
item 1 1. one
2. two
3. three
另外多列表格的表示方式还可以简写,可以去掉前后2个竖线

示例代码:

Header1 Header2
item 1 1. one
item 2 2. two

改变表格内容的对齐方式

Header1 Header2 Header3
item 1 文字右对齐 1. 文字左对齐 文字居中对齐
item 2 2. two 居中