Markdown 语法笔记
一、概念:
- Markdown 语法旨在成为一种适用于网络书写的语言。
- Markdown 并不是要取代 HTML, 它只是涵盖了 HTML的一小部分标记。Markdown 的理念是,能让文档更容易读、写和随意改。
- Markdown 兼容 HTML,在Markdown涵盖范围之外的内容,都可以使用 HTML 来编写,并且不需要额外标注区分 Markdown 和 Html。直接加标签就OK。
- Markdown 中的特殊字符自动转换。在 HTML 中如果你要打印出
<
和&
,那么你必须实体的形式<
和&
。但是在 Markdown 中你可以很容易书写字符。如果你使用的 & 字符是 HTML 字符实体的一部分,它会不进行转换保留原状,否则它会被转换成 &。
所以你如果要在文档中插入一个版权符号 ©,你可以这样写:
©
Markdown 会不会转换,保留它不动。而若你写:
AT&T
Markdown 就会自动将它转为:
AT&T
类似的状况也会发生在 < 符号上,因为 Markdown 允许兼容 HTML ,如果你是把 < 符号作为 HTML 标签的定界符使用,那 Markdown 也不会对它做任何转换,但是如果你写:
4 < 5
Markdown 将会把它转换为:
4 < 5
这里还有一点需要注意。如果是在 <code>
标签范围内,<
和 &
都会被转换为实体。
二、区块元素:
(1) 段落: 一个或多个连续的文本行的前后要有一个以上的空行才会分段,但其实这是 Markdown 允许段落内的强迫换行。(空行:该行只有一个空格或者制表符就会被认为是空行)。例如:(一二之间隔了一个空行)
这是第一段
这是第二段
但是如果你确实想要依赖 Markdown 来插入 <br />
标签的话,在插入处先按入两个以上的空格然后回车。
(2) 标题:
Markdown 支持两种标题的语法,类 Setext 和类 atx 形式。
类 Setext 形式是用底线的形式,利用 = (最高阶标题)和 - (第二阶标题),任何数量的 = 和 - 都可以有效果。例如:
This is an H1
=============
This is an H2
-------------
效果:
This is an H1
This is an H2
类 Atx 形式则是在行首插入 1 到 6 个 # ,对应到标题 1 到 6 阶,例如:
# 这是 H1
## 这是 H2
###### 这是 H6
效果:
这是 H1
这是 H2
这是 H6
(3) 区块引用:
当需要在某处引用一段内容时,可以通过 >
来引用
例如:
> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
效果:
This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet.
如果是多层引用, 那么就多加几个 >
,如此类推。
这是第一层
这是第二层
(4) 列表:
Markdown 支持有序列表和无序列表。
无序列表使用 +
、-
、*
作为列表标记都可以, 标记与文字之间有一个空格:
例如:
+ Red
- Green
* Yellow
效果:
- Red
- Green
- Yellow
有序列表则使用数字接着一个英文句点:
例如:
1. Red
2. Green
3. Yellow
效果:
- Red
- Green
- Yellow
(5) 代码区段
单行代码 `代码内容`
多行代码
```
代码内容
```
效果如下:
单行
create database hero;
多行
function fun() {
console.log('多行');
}
fun();
(6) 字体:
-
斜体
要倾斜的问题左右分别用一个 * 号或者 _ 号包起来 -
加粗
要加粗的文字左右分别用两个 * 号或者 _ 号包起来 -
斜体加粗
要倾斜加粗的字体左右分别用三个 * 号包起来 -
删除线
要加删除线的文字左右分别用两个 ~~ 号包起来
例子:
*倾斜字体*
_倾斜字体_
**加粗字体**
__加粗字体__
***倾斜加粗字体***
~~删除线字体~~
效果:
倾斜字体
倾斜字体
加粗字体
加粗字体
倾斜加粗字体
删除线字体
(7) 分割线:
三个或者三个以上的 - 或者 * 或者 _ (加空格便于显示)都可以
例子:
---
----
***
****
_ _ _
效果一样:
三、 区段元素:
(1) 超链接:
超链接有两种方式: 行内式 和 参考式
行内式例子:
[超链接名](超链接地址 "超链接title")
title 可不加
效果:
这是一个 百度 的链接地址
这是一个 淘宝 的链接地址
参考式例子:
I get 10 times more traffic from [Google] [1] than from
[Yahoo] [2] or [MSN] [3].
[1]: http://google.com/ "Google"
[2]: http://search.yahoo.com/ "Yahoo Search"
[3]: http://search.msn.com/ "MSN Search"
如果改成用链接名称的方式写:(第二个 [] 中不写 id 值默认和第一个 [] 中的名称一致)
I get 10 times more traffic from [Google][] than from
[Yahoo][] or [MSN][].
[google]: http://google.com/ "Google"
[yahoo]: http://search.yahoo.com/ "Yahoo Search"
[msn]: http://search.msn.com/ "MSN Search"
产生的效果是一样的:
I get 10 times more traffic from Google than from
Yahoo or MSN.
(2) 图片链接:
图片链接同样有两种形式: 行内式 和 参考式
行内式例子:
![图片alt](图片地址 "图片title")
图片alt 就是图片不显示时显示的文字内容,相当于描述
图片title 就是图片的标题, 鼠标移到上面去时会显示,可加可不加
![百度图片](http://img3.duitang.com/uploads/item/201410/02/20141002100803_ndjUZ.jpeg "百度图片")
效果:
参考式例子:
![Alt text][id]
「id」是图片参考的名称,图片参考的定义方式则和链接参考一样:
[id]: url/to/image "Optional title attribute"
到目前为止, Markdown 还没有办法指定图片的宽高,如果你需要的话,你可以使用普通的 标签。
(3) 表格:
例子:
姓名|技能|排行
-|:-:|-:
刘备|哭|大哥
关羽|打|二哥
张三|骂|三弟
第二行分隔表头和内容
文字默认居左
-两边加: 表示文字居中
-右边加: 表示文字居右
注: 原生的语法两边都要用 | 包起来,这里省略;不同网站的编辑器对于markdown的支持不同,表格流程图可能会有差异。
效果:
姓名 | 技能 | 排行 |
---|---|---|
刘备 | 哭 | 大哥 |
关羽 | 打 | 二哥 |
张三 | 骂 | 三弟 |