MarkDown 编辑器学习
是一种简单快键的文字排版工具,可以用于编写说明文档,鉴于其语法简洁明了,且其渲染生成的样式简单美观,很多开发者也用它来写博客,已被国内外很多流行博客平台所支持。生成的文件后缀名为.MD,亦可以导出生成HTML或PDF文件。
常用语法备忘
(一)标题
说明:在段落首用#申明标题,根据#数区别标题级别,Markdown一共有6级标题,对应于HTML中的<h1>
-<h6>
标签,不同级别的标题除了大小区别外,样式也存在差异。
格式:#表示一级标题,##表示二级标题,以此类推;什么也不标注即表示以正文格式输入。
(二)列表
说明:分为无序列表和有序列表,分别对应于HTML中的<ul>
和<ol>
标签
格式:
无序列表: * listName // 星号+空格+名字,也可以用+,-代替*,效果一样
有序列表: 1. listName // 数字+英文点+空格+名字
(三)图片
说明:对应于HTML中的<image>
标签,可添加本地图片或网络图片。如果是需要分享到网上的文章,图像最好要先上传到网上,如github。MarkDown也自带上传图像到网络的功能,操作为:a).点击图标或快捷键“Ctrl+G”; b).在弹出框中按"浏览并上传"按钮上传指定图像。
注意:网盘链接不行,因为网盘分享的并非图像路径。
格式:有两种格式:行内格式、参考格式;
行内格式:图片地址直接跟在图片文字后面。
![alt text](/path/to/img.jpg "Title")
其生成的HTML为:
<img src="/path/to/img.jpg" alt="alt text" title="Title" />
,alt表示图像生成失败时的替换文本。参考格式:在引用处只为图片地址申明一个名称,然后在文件其他地方定义图片地址内容,地址名称可以由字母、数字、空格组成,不区分大小;
这是一副图像![alt text][1]
[1]: /path/to/img.jpg "Title"
(四)链接
格式:对应于HTML中<a>
标签,有三种格式:行内格式、参考格式、自动链接格式;
行内格式
这是一个链接[example link](http://example.com/ "With a Title").
其生成的HTML为:
<p>这是一个链接<a href="http://example.com/" title="With a Title">example link</a>.</p>
。参考格式
这是链接一[example link1][1],这是链接二[example link1][2];
[1]: http://google.com/ "Google"
[2]: http://search.yahoo.com/ "Yahoo Search"
自动链接格式:对于链接文字和链接内容一致的网址或是电子邮箱链接,可以以较为简短的自动链接格式标注,即直接用方括号将链接起来;
这是百度网址:<http://www.baidu.com>
(五)代码
格式:有三种格式:行内代码、代码块,指定语言代码块;指定语言代码块中的代码将以指定语言标记风格进行标记展示。
行内代码:在代码首尾尾加`符号;
This is a code `int i = 0`;
代码块:代码段向右缩进4个空格或是一个tab;
This is a code segment int i = 0;
i = i + 1;
指定语言代码块:代码块首 + ```html(或js,java...); 代码块尾 + ```;(以下代码在markdown上无法渲染,但是在博客园里能正常显示,谁知道是为什么啊?)
```html
<p> woshishui <p>
<p> woshinia <p>
```
(六)其他
- 转义符号:Markdown中的转义符号为'\',可转义的字符包括:*,#,\,`,_,{},[],(),+,-,.,!;也可以用ASCII码,比如表格里面加'|'可以用
|
表示; - 分割线: ***
- 粗体:语句首尾加**,对应于HTML语言的
<em>
标签; - 斜体:语句首尾加*,对应于HTML语言的
<strong>
标签; - 缩进:
$emsp
表示空格;
常用快捷键备忘
- 加粗 Ctrl + B
- 斜体 Ctrl + I
- 引用 Ctrl + Q
- 插入链接 Ctrl + L
- 插入代码 Ctrl + K
- 插入图片 Ctrl + G
衍生阅读:
参考链接
[1] Markdown 语法说明
[2] markdown学习笔记
[3] MarkDown 的基本语法和快捷键,20分钟快速学会
[4] 前端学Markdown