sublime-4:用sublime撰写markdown文档

摘要:本文包含两部分内容:在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.图片

![这就是个图片嘛](http://upload-images.jianshu.io/upload_images/3084894-10e1f13e30bce46e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
这就是个图片嘛

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猿”找到小猿哦!!!


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,937评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,503评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,712评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,668评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,677评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,601评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,975评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,637评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,881评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,621评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,710评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,387评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,971评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,947评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,189评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,805评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,449评论 2 342

推荐阅读更多精彩内容