Markdown语法

发表于
Markdown的日常使用

强调标记

1
2
3
4
5
6
*斜体*
_斜体_
**粗体**
__粗体__

显示效果如下：

斜体

斜体

粗体

粗体

分割线

1
2
3
4
***
* * *
---
___

显示效果如下：

*

列表

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
Unordered List:
* English
* Japanese
* Chinese
* ……
Unordered List:
- English
- Japanese
- Chinese
- ……
Ordered List:
1. Orange
2. Apple
3. Banana

显示效果如下：

Unordered List:

  • English
  • Japanese
  • Chinese
  • ……

Unordered List:

  • English
  • Japanese
  • Chinese
  • ……

Ordered List:

  1. Orange
  2. Apple
  3. Banana

多层级列表：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
两都名胜
- 南京
  + 玄武湖
  + 中山陵
  + 鸡鸣寺
- 杭州
  + 西湖
    * 苏堤
    * 湖心亭
    * 太子湾
  + 九溪
  + 灵隐
  
注：此处的几个符号作用都是一样的，不同层级符号有所区别只为显示美观。日常使用，请每一级的符号一致。

两都名胜

  • 南京
    • 玄武湖
    • 中山陵
    • 鸡鸣寺
  • 杭州
    • 西湖
      • 苏堤
      • 湖心亭
      • 太子湾
    • 九溪
    • 灵隐

引用

使用>添加在每行的开头
注意点：
1.>的上一行，必须为空行；

1
2
3
4
5
6
7
8
9
> 五月天《天使》
> 像孩子依赖着肩膀 
> 像眼泪依赖着脸庞 
> 你就像天使一样 
> 给我依赖 给我力量 
注意点：
每一行最后换行，添加两个空格符，不然内容会挤压在一块，变成一行。或者行与行之间，空一行。

五月天《天使》

像孩子依赖着肩膀
像眼泪依赖着脸庞
你就像天使一样
给我依赖 给我力量 

1
2
3
4
> 浙江
>> 杭州
>>> 西湖
>>>> 湖心亭

浙江

杭州

西湖

湖心亭

链接

1
2
文字链接和图片链接都是这个语法
[Link Name](Link)

添加图片

1
![](http://ou1vkkdvq.bkt.clouddn.com/image/ParallaxImage/ParallaxImage08.jpg)

表格

1
2
3
4
5
6
7
|Title |Title 1|Title 2|Title 3|
|---|---:|:---:|---:|
| A|B|C|D|
:–-- 冒号在左，左对齐
--–： 冒号在右，右对齐
：--–： 左右两侧都出现冒号，居中对齐
Title Title 1 Title 2 Title 3
A B C D

扩展–基于 Markdown 的 HTML 语言运用

添加图片

使用图床的图片

单张居中展示：

1
2
3
4
5
6
7
8
9
<center>
    <img src="http://xxx.png">
</center>
或者
<figure>
    <img src="http://xxx.png">
</figure>

固定图片尺寸

1
<img src="http://xxx.png" title="Logo" width="100" />

两张图片并排展示

1
2
3
4
5
6
7
8
9
10
11
12
<figure class="half">
    <img src="http://xxx.png">
    <img src="http://xxx.png">
</figure>
或者
<p align="center">
<img src="http://xxx.png" width="200"/>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<img src="http://xxx.png" width="200"/>
</p>

三张图片并排展示

1
2
3
4
5
<figure class="third">
    <img src="http://xxx.png">
    <img src="http://xxx.png">
    <img src="http://xxx.png">
</figure>

使用github项目文件夹内的图片

1
{{site.url}}/images/xxx.png

附加浏览窗口的模式
点击图片可以跳出一个预览窗口，可以看大图和切换图片

1
2
3
4
<figure class="half">
    <a href="http://xxx.png"><img src="http://xxx.png"></a>
    <a href="http://xxx.png"><img src="http://xxx.png"></a>
</figure>