写在前面
之前在 CSDN 写过一段时间的博客,使用的是传统的文本。最近利用 Github+Hexo
搭建了一个静态页面的个人博客,发现在上面写博客必须使用 Markdown,这才发现现在写博客几乎都在使用 Markdown。后知后觉的感觉真是不爽,因此便有了这篇 Markdown 入门教程,希望那些同我一样不会使用 Markdown 的同志受到一些启发。
一、认识Markdown
Markdown 是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。Markdown 的语法简洁明了、学习容易,不要以为它是一门语言就以为它很难,其实它很简单,而且功能比纯文本更强,因此有很多人用它写博客。
二、Markdown的优点
- 纯文本,所以兼容性极强,可以用所有文本编辑器打开。
- 让你专注于文字而不是排版。
- 格式转换方便,Markdown 的文本你可以轻松转换为 html、电子书等。
- Markdown 的标记语法有极好的可读性。
三、Markdown的编辑器
我在前面说过,Markdown 可以使用普通文本编辑器编写,但是在普通文本编辑器编写肯定不方便,因为你也不敢肯定你写出来是什么样子的,因此我们需要更高级的编辑器。
- Windows 平台
通过我在网上寻找,发现有两款还不错,一款叫做 MarkdownPad ,另一款叫做 MarkPad,我目前使用的是 MarkdownPad。 - Mac OS 平台
我强烈建议你用 Mou 这款免费且十分好用的 Markdown 编辑器,它支持实时预览,既左边是你编辑 Markdown 语言,右边会实时的生成预览效果。不仅如此,Mou 还有一些有趣的偏好设置(Preference),例如主题(Themes)与样式(CSS),它们可以配置出定制化的文本编辑效果与导出效果,如果你对自带的主题与样式不满意还可以到 GitHub 上搜索其它爱好者为 Mou 编写的更多主题样式,导入的方式可以在偏好设置的 Themes 或 CSS 选项中 选择 reload。 - Web 平台
我强烈推荐简书这款产品,上面有无数热爱文字的人在不停的创造,分享。在 Web 端使用 Markdown 没有比简书更舒服的地方了,同样支持左右两栏的实时预览,字体优雅,简洁。
四、Markdown语法
1、标题
标题是Markdown中最为常用的格式,在平时常用的的文本编辑器中大多是这样实现的:输入文本、选中文本、设置标题格式。而在 Markdown 中,你只需要在文本前面加上 #
即可,同理、你还可以增加二级标题、三级标题、四级标题、五级标题和六级标题,总共六级,只需要增加 #
即可,标题字号相应降低。例如:
# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题
效果如下:
一级标题
二级标题
三级标题
四级标题
五级标题
六级标题
注意:#
和「一级标题」之间建议保留一个字符的空格,这是最标准的 Markdown 写法。
2、粗体和斜体
Markdown 的粗体和斜体也非常简单,用 **
包含一段文本就是粗体的语法,用一个 *
包含一段文本就是斜体的语法。例如:
**我是粗体**
*我是斜体*
效果如下:
我是粗体
我是斜体
注意:前后的 *
与要与加粗或倾斜的字体之间不能有空格。
3、引用
在我们写作的时候经常需要引用他人的文字,这个时候引用这个格式就很有必要了,在 Markdown 中,你只需要在你希望引用的文字前面加上 >
就好了,例如:
> 这是引用
效果如下:
这是引用
引用还可以嵌套,>>
表示引用里面再套一层引用,依次类推。例如:
> 这是一级引用
>> 这是二级引用
>>> 这是三级引用
效果如下:
这是一级引用
这是二级引用
这是三级引用
注意:
1、如果 >
和 >>
嵌套使用的话,从 >>
退到 >
时,必须之间要加一个空格或者 >
作为过渡,否则默认为下一行和上一行是同一级别的引用。
2、引用标记里可以使用其他标记,如:有序列表或无序列表标记,代码标记等。
4、代码块
如果你是个程序猿,需要在文章里优雅的引用代码框,在 Markdown 下实现也非常简单,如果引用的语句只有一段,不分行,可以用 ` 将语句包起来。如果引用的语句为多行,可以使用```将这段代码包围起来。例如:
效果如下:
public class HelloWorld {
public static void main(String[] args) {
System.out.println("Hello World");
}
}
`System.out.println("Hello World");`
**注意:
1、` 这个符号是在 Esc 键下面,切换到英文下即可。
2、``` 后面的 java 表示此段代码为 java 代码,Markdown 会自行使用 java 代码颜色渲染。这里也可以不写。**
##5、图片
在 Markdown 中,插入图片不需要其他按钮,你只需要使用 `` 这样的语法即可,其中:
* `Alt text` 为如果图片无法显示时显示的文字;
* `/path/to/img.jpg` 为图片所在路径;
* `Optional title` 为显示标题。显示效果为在你将鼠标放到图片上后,会显示一个小框提示,提示的内容就是 `Optional title` 里的内容。
例如:
效果如下:
>
**注意:
1、导入的图片路径可以使用绝对路径也可以使用相对路径,建议使用相对路径。
2、我通常的做法是Markdown文档的同级目录下建立一个pictures文件夹,里面放置所有所需的图片,如果图片多的话,你也可以在pictures文件夹里建立子文件夹归类。**
##6、列表
熟悉 HTML 的同学肯定知道有序列表与无序列表的区别,在 Markdown 下,列表的显示只需要在文字前加上 `-` 或 `*` 或 `+` 即可变为无序列表,有序列表则直接在文字前加 `1.` `2.` `3.`,符号要和文字之间加上一个字符的空格。例如:
无序列表
- 呵呵
- 嘉嘉
- 嘻嘻
- 吼吼
- 嘎嘎
- 桀桀
有序列表
- 第一点
- 第二点
- 第三点
效果如下:
>无序列表
* 呵呵
* 嘉嘉
* 嘻嘻
* 吼吼
* 嘎嘎
* 桀桀
>有序列表
1. 第一点
2. 第二点
4. 第三点
**注意:
1、无序列表或有序列表标记和后面的文字之间要有一个空格隔开。
2、有序列表标记不是按照你写的数字进行显示的,而是根据当前有序列表标记所在位置显示的,如示例所示。
3、无序列表的项目符号是按照实心圆、空心圆、实心方格的层级关系递进的,如示例所示。通常情况下,同一层级使用同一种标记表示,便于自己查看和管理。**
##7、分割线
使用 `---` 或者 `***` 或者 `* * *` 表示水平分割线。例如:
效果如下:
>---
***
* * *
**注意:
1、只要 `*` 或者 `-` 大于等于三个就可组成一条平行线。
2、使用 `---` 作为水平分割线时,要在它的前后都空一行,防止 `---` 被当成标题标记的表示方式。**
##8、链接
在 Markdown 中,插入链接不需要其他按钮,你只需要使用 `[](link "Optional title")` 这样的语法即可,其中:
* `[]` 内的内容为要添加链接的文字。
* `link` 为链接地址。
* `Optional title` 为显示标题。显示效果为在你将鼠标放到链接上后,会显示一个小框提示,提示的内容就是 `Optional title` 里的内容。
例如:
效果如下:
>[Baidu](www.baidu.com "百度一下,你就知道" )
##9、反斜杠
使用 `\` 表示反斜杠。在你不想显示 Markdown 标记时可以使用反斜杠。例如:
*这里不会显示斜体*
效果如下:
>\*这里不会显示斜体\*
##10、空格
Markdown 语法会忽略首行开头的空格,如果要体现出首行开头空两个的效果,可以使用 **全角符号下的空格**,windows下使用 `shift+空格` 切换。
##11、删除线
使用 `~~` 表示删除线。例如:
这是一条删除线
效果如下:
>~~这是一条删除线~~
**注意:
1、注意 `~~` 和 要添加删除线的文字之间不能有空格。
2、我常使用在显示的告诉自己这行文字是要删除的。**
#结语
以上就是我在学习Markdown后的总结,其中介绍的Markdown语法都是比较常用的,我也对这些语法做出了比较详细的说明,如果有描述的不对的地方,欢迎批评指正,希望能对各位有所帮助。