JOHN GRUBER定义的markdown语法。
段落与换行
1.段落的前后必须空行:空行指的是什么内容都没有,或者只有空白符(空格或制表符)
相邻两行文本,如果中间没有空行会显示在一行中(换行符被转换成为空格)
2.如果需要在段落内加入换行(<br/>
)
可以在前一行的末尾加入至少两个空格,然后换行写其他的文字
3.Markdown中的多数区域都需要在两个空行之间
标题
Setext格式
1 | H1 |
渲染效果:(不包含上下的分隔线)
H1
H2
atx格式
- 可以使用对称的
#
包括文本:
1 | ## H2 ## |
对于有道云笔记文本和 标准语法就是这样的。#
之间必须有空格。
渲染效果:
H2
H3
- 也可以只在左边使用
#
:
1 | ### H3 |
渲染效果:
H3
H4
JOHN’s Heaser
1 | HEADERS |
各种Markdown软件的渲染结果可能会有一些差别,但是了解一下标准的语法是没坏处的。
引用
1.引用内容
在段落或者内容前使用>
符号,就可以将这段内容标记为‘引用’的内容(<blockquote>
):
1 | >引用内容 |
渲染效果:
引用内容
2.多行引用
1 | >多行引用 |
渲染效果:
多行引用
可以在每一行前加>
符号
1 | >如果仅在第一行使用`>`, |
渲染效果:
如果仅在第一行使用
>
,
后面相邻的行即使省略>
,也会变成引用内容
1 | >如果引用的内容需要换行, |
渲染效果:
如果引用的内容需要换行,
可以在行尾添加两个空格或者在引用内容中加一个空行
3.嵌套引用
1 | >也可以在引用中 |
渲染效果:
也可以在引用中
使用嵌套的引用
4.其它Markdown
1 | >在引用中可以使用其它任何*Markdown*语法 |
渲染效果:
在引用中可以使用其它任何Markdown语法
列表
无序列表
1 | * 可以使用`*`作为标记 |
渲染效果:
- 可以使用
*
作为标记
- 也可以使用
-
- 或者
+
有序列表
1 | 1. 有序列表以数字和`.`开始; |
渲染效果:
- 有序列表以数字和
.
开始; - 数字的序列并不会影响生成列表的序列;
- 但是仍然推荐按照自然顺序(1.2.3…)编写
嵌套的列表
1 | 1. 第一层 |
渲染效果:
- 第一层
- 1-1
- 1-2
- 1-3
- 无序列表和有序列表可以随意相互嵌套
- 2-1
- 2-2
- 2-3
语法和用法
- 无序列表项的开始是:符号 空格;
- 有序列表项的开始是:数字
.
空格; - 空格至少为一个,多个空格将被解析为一个;
- 如果仅需要在行前显示数字和
.
:
1 | 05\. 可以使用:数字\. 来取消显示为列表 |
05. 可以使用:数字\. 来取消显示为列表
代码
代码块
可以使用缩进来插入代码块:
<html>
<title></title>
</html>
代码块前后至少有一个空行,切每行代码前至少有一个Tab或者四个空格;
行内代码
通过`,插入行内代码(
是Tab键上边、数字1
键左侧的按键);
例如<title>Markdown</title>
转换规则
代码块中的文本(包括Markdown语法)都会显示为原始内容,而特殊字符会被转换为HTML字符实体
分割线
- 可以在一行中使用三个或更多的
*
,-
或_
来添加分隔线(
): - 多个字符之间可以有空格(空白符),但不能有其它字符:
1 | *** |
渲染效果:
*
超链接
行内式
格式为:[link text](URL "title text")
[Google](http://www.google.com)
Google
[icon](./images/icon.png)
icon
超链接的title就是鼠标放上去(不是点击)时就弹出来的提示:
[Google](http://www.google.com "Google Title")
注:title text使用’或者”都是可以的。
参考式
参考式链接的写法相当于行内式拆分成两部分,并通过一个识别符连链接两部分。参考式能尽量保持文章的结构简单,也方便统一管理URL
- 链接格式
第一个方括号为链接文本,第二个方括号为 链接独有的标识符,可以是字母、数字、空格或标点符号。标识符是不区分大小写的
[link text][link-sign]
- 链接内容
其中URL可以使用<>包起来,title可以使用’’、””、 ()包括(考虑到兼容性,建议使用引号),title部分也可以换行来写;
链接内容的定义可以放在同一个文件的任意位置;
- 备注
可以省略标识符,直接使用link text作为标识符。
这种情况下第二个方括号可以为空或者直接省略第二个方括号。
参考格式的优点在于可以在多个不同的位置引用同一个URL。
1 | [Google][google-link] |
渲染效果:
自动链接
使用<>
包括的URL或者邮箱地址会被自动的转换为超链接:
1 | <http://www.google.com> |
渲染效果:
http://www.google.com
123@email.com
这种方式适合行内较短的链接,会使用URL作为超链接文章,邮箱地址会自动编码,以逃避抓取机器人。
图片
插入图片的语法和插入超链接的语法基本一致,只是在最前面多一个!
。也分为行内式和参考式两种。
行内式
1 | ![Imgur](http://i.imgur.com/YACdsVS.jpg) |
方括号部分是图片的替代文本,括号中的’title’部分和连接是一样的,是可选的。
参考式
1 | ![Imgur][rosse] |
指定图片的大小
Markdown不支持指定图片的大小,不过可以通过直接插入标签来指定相关属性:
1 | <img src="http://i.imgur.com/YACdsVS.jpg" alt="rosse" title="rosse" width="50" height="30"/> |
注:这在有道云笔记里是不支持的!
强调
- 使用
* *
或_ _
包括的文本会被转换为,通常表现为斜体。 - 使用
** **
或__ __
包括的文本会被转换为,通常表现为加粗。 - 用来包括文本的或_内侧不能有空白,否则 _将不会被转换。
- 如果需要在文本中成对显示*或者_,可以在符号前加入
\
即可。 - 强调的特殊符号必须成对使用。
1 | *Hello world!* |
Hello world!
Hello world!
Hello world!
Hello world!
*Hello world!*
_Hello world!_
字符转义
反斜线 \
用于插入在Markdown语法中有特殊作用的字符。
这些字符包括:
1 | \ |
Markdown 扩展语法
Markdown标准 本身包含的功能有限,所以产生了许多第三方的扩展语法,如Github Flavored Markdown。
删除线
用~~ ~~
包括的内容将以删除线的形式展现。
1 | ~~删除线~~ |
删除线
代码块和语法高亮
代码块
- 与缩进添加代码块不同,这里使用 \
来包含多行代码。```需要单独占一行。 1
2
3
4
5
6
7
8
9
10
11
122. 在第一组```之后添加代码的语言,如'javascript'或者'js',即可以将代码标记为Javascript。
```c++
include<iostream>
using namespace std;
int main(void)
{
cout << "Hello world!";
return 0;
}
1 | include<iostream> |
1
window.addEventListener('load', function() {console.log('window loaded');});
1 | window.addEventListener('load', function() {console.log('window loaded');}); |
表格
单元格和表头
- 使用
|
来分隔不同的单元格,使用来分隔表头和其它行。 - 为了美观,可以使用空格对齐不同的单元格,并在左右两侧都使用
|
来标记单元格边界。 - 在表头下方的分隔线中加入
:
,即可标记下方单元格内容的对齐方式。单元格内容默认为左对齐,表头内容会一直居中对齐。 - 表格中可以插入其它Markdown内容的行内标记,比如超链接等。
1 | | name | age | |
name | age |
---|---|
LearnShare | 12 |
Mike | 20 |
name | age | blog |
---|---|---|
LearnShare | 12 | Learn |
Mike | 20 |
Task list
1 | - [ ] Eat |
- [ ] Eat
- [x] Code
- [x] HTML
- [x] CSS
- [ ] Javascipt
- [ ]Sleep
编辑器与扩展
这部分给大家介绍一些可以用来书写、编辑Markdown的工具,包括独立客户端、编辑器/IDE插件,以及WEB的工具,排名不分先后。
也欢迎你来推荐自己喜欢的工具和插件。
- MarkdownPad Windows
- Text Windows OSX
- MarkPad Windows
- MdCharm Windows Linux
- Mardown Edit Windows
- CuteMarkEdWindows Linux
- Haroopad Windows OSX Linux
- Mou OSX
- MacDown OSX
- Markdown Pro OSX
- ReTextLinux
- sublime-markdown-extendedSublime Text
- Atom Markdown PreviewAtom
- IDEA MarkdownIDEA
- cmd MarkdownWindows OSX Linux web
- StactEditWeb
- DillingerWeb