摘要：本文包含两部分内容：在sublime里安装Markdown Preview插件来实现markdown文件的预览;介绍markdown常用的语法，让初次接触markdown的人可以在短时间内掌握常用的语法和句法
1.什么是markdown
Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档，然后转换成格式丰富的HTML页面。 —— 维基百科
2.安装Markdown Preview插件
推荐的安装方法是通过[Package Control(https://sublime.wbond.net/)来安装：如果你的sublime还没有装Package Control，需要先点击这里查看安装方法使用 ctrl + shift + P来打开命令窗口，输入并选择 Package Control: Install Package在弹出的窗口里输入 Markdown Preview并按回车来完成安装
3.配置Markdown Preview插件
3.1.配置快捷键
通过 Preferences -> Key Bindings - User打开sublime的快捷键配置文件，把下面内容复制到这个设置文件里保存。
{ "keys": ["alt+m"], "command": "markdown_preview",
"args": {"target": "browser", "parser":"markdown"} }
配置完成后，按下alt + m即可直接在浏览器里预览markdown的写作效果。
3.2.代码高亮
markdown里嵌入的代码在生成html文档时，支持根据语言高亮显示。通过 Preferences -> Package Settings -> Markdown Preview -> Settings-User来打开用户设置文件，加入如下内容即可打开代码高亮功能。
{ "enable_highlight": true}
如果需要更高级的高亮显示，比如指定代码高亮的风格(emacs, vim etc.)，则可以自定义 codehilite扩展来实现。在Markdown Preview用户设置文件里加入如下内容即可。本文就是使用 emacs高亮风格来显示代码的。
{ "enabled_extensions": [ "extra", "github", "toc",
"headerid", "meta", "sane_lists", "smarty",
"wikilinks", "admonition", "codehilite(guess_lang=False,
pygments_style=emacs)" ]}
关于pygments，pygments_style可以用来指定代码高亮的风格。Markdown Preview使用pygments来完成代码高亮。关于pygments以及更多可用的内置代码高亮风格，可访问pygments官网查阅相关文档。
3.3配置css文件
Markdown Preview生成的HTML文件，在浏览器里查看时其默认的宽度为45em，如果你觉得生成的网页太窄，可以修改一下css文件。打开Markdown Preview的安装目录，找到markdown.css和github.css文件，查找下面的内容：
body {
width: 45em; border: 1px solid #ddd;
outline: 1300px solid #fff;
margin: 16px auto; }
把里面的45em修改为80%或者你认为合适的尺寸即可。sublime安装包目录与格式Linux环境通过 Package Control: List Packages，在己安装的Packages里选择 Markdown Preview会直接打开Markdown Preview的安装目录，在打开的目录中直接可以找到markdown.css和github.css。Windows环境在sublime安装目录下，找到 Data\Installed Packages目录，这个目录就是安装包的目录。如果已经安装好Markdown Preview，可以看到文件 Markdown Preview.sublime-package 。这个其实是一个zip包。直接用系统里的压缩工具打开，然后在压缩包的根目录下查找markdown.css和github.css，按照上述方法修改即可。修改完成需要保存回压缩包。在打开压缩包修改的时候，必须关闭sublime，否则无法修改成功。
4.几个常用的markdown语法示例
4.1.标题
#标题1
##标题2
###标题3
4.2.列表
1).无序列表:
* 列表1
* 列表2
* 列表3
- 列表1
- 列表2
- 列表3
2).有序列表
1. 列表1
2. 列表2
3. 列表3
4.3.弹出式注释
把鼠标停留在**HTML**和**W3C**上看会发生什么。
*[HTML]: Hyper Text Markup Language
*[W3C]: World Wide Web Consortium
4.4.定义列表
Apple: Pomaceous fruit of plants of the genus Malus in the family
Rosaceae.Orange: The fruit of an evergreen tree of the genus Citrus.
4.5.代码片段
python #!python # -*- coding: utf-8 -*- from flask import Flask,
render_template app = Flask(__name__) app.debug = APP_DEBUG
#homepage just for fun @app.route('/') def home(): return
render_template('index.html')
4.6.角注
Footnotes[^1] have a label[^@#$%] and the footnote's content.[^1]: This
is a footnote content.[^@#$%]: A footnote on the label: "@#$%".
4.7.表格
|故事点 |8:30-9:30 |9:30-10:30 |10:30-11:30 |14:00-15:00 |15:00-16:00 |16:00-17:00 |17:00-18:00 |18:00-19:00 |
|---|---|---|---|---|---|---|---|---|
|故事|1.测试修改过的规则;2.修改有问题规则;||||||||
|完成<br>情况||■■|■■■|■■■|■■|■■|■|■■■|
|总结|||||||||
| 故事点 | 8:30-9:30 | 9:30-10:30 | 10:30-11:30 | 14:00-15:00 | 15:00-16:00 | 16:00-17:00 | 17:00-18:00 | 18:00-19:00 |
|---|---|---|---|---|---|---|---|---|
| 故事 | 1.测试修改过的规则;2.修改有问题规则; | |||||||
| 完成 情况 |
■■ | ■■■ | ■■■ | ■■ | ■■ | ■ | ■■■ | |
| 总结 |
4.8.警告
hint类型的警告:
!!! hint "subject of hint" Any number of other
indented markdown elements.
note类型的警告:
!!! note "subject of
note" Any number of other indented markdown elements.
...................................
警告有多种类型，类型不同生成的html文档样式也不一样，可用的样式有 hint, attention, caution, danger, question, note。
4.9.强调
这是**黑体**写法
这是*斜体*的写法
这是黑体写法
这是斜体的写法
4.10.超链接
1).这是一个[链接](https://github.com/kamidox/blogs)
2).这是另外一种[链接][1]的形式[1]: https://pythonhosted.org/Markdown/extensions/index.html
4.11.引用
> 引用的文字内容> 这是另外的引用内容
4.12.图片
这就是个图片嘛
4.13.目录
[TOC]
5.练习
直接在配置好的sublime里新建一个readme.md，把上面的markdown语法拷贝进去练习一下。
推荐一个做得相当不错的markdown在线编辑器马克飞象。本文就是用markdown编写的。
最佳实践Windows下可以使用sublime对markdown进行编辑预览。但Linux下要让sublime支持中文输入还需要折腾一番。个人认为最佳实践是这样的Windows下，使用sublime对markdown进行编辑，预览。Linux下，直接使用gedit对markdown进行编辑。gedit的markdown语法高亮看起来非常舒服。编辑完成后，用sublime打开预览效果
扫描以下公众号关注小猿↓↓↓↓↓↓↓↓
更多资讯请在简书、微博、今日头条、掘金、CSDN都可以通过搜索“Share猿”找到小猿哦！！！
网友评论