一起学习MarkDown语法

初识MarkDown

  第一次接触MarkDown已经是几年以前的事情了,当时在GitHub上面看优秀的开源代码。看到开源作者写的ReadMe.md时就在赞叹,一个文档居然可以写得这么飘逸、整洁!

  好看的东西都想据为己有,学呗。结果在看过完整的MD文本编辑语法之后就果断并且立即放弃了,为啥呢?现在想起来或许是刚毕业的第一年,行事作风还是比较心浮气躁(现在依旧心浮气躁,只是相比那时已经好了不少^_^)。对于学习这件事情当时的想法是刚刚脱离苦海不愿再投入精力去学习。

  学习MarkDown是从我在GitHub创建第一个repositore开始的,那时我在上下班公交车上将别人写的MD语法介绍的博客读了几遍。这里向大家推荐一位名叫“果冻虾仁”的前辈,貌似是鹅厂的大侠。果冻虾仁大侠专门在GitHub建了一个repositore来详细解释MD语法。

  果冻虾仁GitHub/ReadMe

  现在越来越多的开发人员的ReadMe都是使用MarkDown写的,所以学习一下MD语法还是很有必要的。

  还要向大家推荐一下MarkDown编辑器,有人喜欢在线的,有人喜欢本地的,都可以直接去百度找适合自己的编辑器。我使用的是CuteMarkEd,这是一款在GitHub开源的一款免费MarkDown编辑器。

  CuteMarkEd的GitHub地址

PS:MarkDown语法本身是不支持修改文本的格式的,但是直接嵌入HTML语法之后就可以了。比如上面的超链接就是这样,包括本句。

在WordPress中使用MarkDown

  wordpress的编辑器用的实在是很难受,所以就想着有没有什么办法将wordpress的编辑器使用MarkDown编辑器代替。结果百度一搜有很多详细的教程,秉着偷懒最光荣的基本原则,这里就不再详述,需要的直接百度即可。

  我是使用的JetPack插件,看介绍里面说是wordpress官方的插件。启用插件之后还需要激活才能正常使用,这个插件附带的功能还是很多的,依个人需求开启相关功能即可。

  PS:使用GitHub的编辑和预览功能可以很方便的学习MarkDown语法,慢慢的学习吧,多加练习尽快掌握常用语法。

MarkDown语法练习

  这里就参照果冻虾仁大侠GitHub上面ReadMe.MD里介绍的语法一个一个亲自打一遍,有时间就写一两个。

  每一个coder都应该认识到自己正在从事或即将从事的这个行业是做中学的,你看别人的代码看上个把月也不及自己亲手敲上几遍。

目录

  (wordpress就算添加了MarkDown插件也不能支持GitHub的MarkDown的所有功能,比如说目录跳转。)

  [名字](链接标题)

  一般来说名字链接标题是一样的,可以理解为MarkDown内部的一个超链接(参照外部链接命令),链接标题必须是标题类型。

横线

  果冻大侠说是横线效果,其实我想说这是粗横线^_^

***、—、___都可以显示横线效果

***


标题

# 一级标题

## 二级标题

### 三级标题

#### 四级标题

##### 五级标题

###### 六级标题

  显示效果如下:

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

PS:在正常文本下一行加上一个或一个以上,就等同于一个一级标题。

  在正常文本下一行加上一个或一个以上-,就等同于一个二级标题。

# 我是一个一级标题

我也是一个一级标题

======

  效果:

我是一个一级标题

我也是一个一级标题

## 我是一个二级标题

我也是一个二级标题

-------

  效果:

我是一个二级标题

我也是一个二级标题

文本

  文本有很多种格式,各个博主给的名字也不一样,同样格式在不同MarkDown阅读器上面显示样式也不一样。所以这里就做一下展示,不再具体分类。

1、在文本行开头加入1个Tab或者4个空格,不能紧随</br>,遇到回车换行之前一直保持该格式。

2、使用一对三个反引号也能实现1的效果,同样不能紧随</br>


引号中间的文字会全部被格式化。


 显示效果:

3、换行

在MarkDown语法里面你直接打一个回车换行是没有效果的。有四种方法可以实现回车换行:
第一:在一行的结尾打两个空格再敲回车;
第二:在两行中间加一个空格实现回车换行的效果,只不过行间隔会变得比较大;
第三:直接在行的结尾加上</br>就能实现回车换行的效果。

4、斜体、粗体、删除线
斜体:一对单*将文本夹在中间;一对单_将文本夹在中间;
粗体:一对双*将文本夹在中间;一对双_将文本夹在中间;
删除:一对双~将文本夹在中间;
然后就是随意组合了。

语法 效果
*斜体1* 斜体1
_斜体2_ 斜体2
**粗体1** 粗体1
__粗体2__ 粗体2
这是一个 ~~删除线~~ 这是一个 ~~删除线~~
***斜粗体1*** 斜粗体1
___斜粗体2___ 斜粗体2
***~~斜粗体删除线1~~*** ~~斜粗体删除线1~~
~~***斜粗体删除线2***~~ ~~斜粗体删除线2~~

图片

这里说的图片是指调用网络图片,涉及到调用网络图片就需要添加链接,这里和设置超链接调准差不多。
调用图片的格式

其中name鼠标停留是显示的名字不是必须的,可以省略。如果省略name,那么前面的[]是可以一起省略的。
我就调用自己github里面的一张图片来演示一下:

效果:
示例

这里有一个类似于代码里面的#define的东西需要给大家介绍一下

这些#define可以写在MarkDown文件的开头或者结尾,它会自动隐藏不在view里面显示的。不过一般都直接扔到文本的结尾,最起码符合一般人的审美观^_^。
使用的时候需要将原来放链接的圆括号()更换为[],我已经在文章末尾添加了”#define“

示例

超链接

超链接的格式与链接图片的格式基本相同,相比图片只是少了前面的!
格式为:

载体:可以是文字,也可以是图片,以图片作为载体的话可以直接使用上面的图片超链接代替载体;同样的如果链接使用“#define”类型的话也需要将()改为[]

示例1,文字超链接:

我的个人网站

示例2,文字超链接简洁版:

[文禾每]已经在文章末尾定义

我的个人网站

示例3,图片链接:

示例4,图片链接简洁版:

图片和连接都在文章末尾定义过了。

![HappyMouse]

锚点

锚点,对于我来说一直都当作一个内部超链接来用。在MarkDown语法里面,任何一个标题都是锚点。
[跳到图片](#图片)
跳到图片

看到锚点的这个特性你想到了什么?没错就是可以把它用到目录上面。
还有什么呢?
跳到图片这几个文字能不能用我们上面的图片代替呢?
当然可以,你可以直接使用图片超链接或者简版图片链接来代替跳转的文字。
MarkDown就是这么灵活,这种例子在MarkDown里面很多,也是MarkDown吸引人的一个特点。

  






—未完待续—


















2018-05-29
290 views