markdown的基本使用

创始人 John Gruber 的 Markdown 语法说明

Markdown 中文版语法说明

标题

标题是每篇文章必备而且最常用的格式。 在Markdown中,如果想将一段文字定义为标题,只需要在这段文字前面加上#,再在 # 后加一个空格即可。还可增加二、三、四、五、六级标题,总共六级,只需要增加 # ,增加一个 # ,标题字号相应降低一级。如图:

# H1
## H2
### H3
#### H4
##### H5

效果如下:

H1

H2

H3

H4

H5

列表

列表格式也很常用,它可以让你的文稿变得井井有条。无序列表,在Markdown中,你只需要在文字前面加上 - 就可以了;如果你希望是有序列表,在文字前面加上 1. 2. 3. 即可。

- 第一行
- 第二行
- 第三行

1. 第一行
2. 第二行
3. 第三行
  • 第一行
  • 第二行
  • 第三行
  1. 第一行
  2. 第二行
  3. 第三行

注:-、1.和文字之间要保留一个字符的空格。

引用

如果你需要在文稿中引用一段别处的句子,那么就要用到「引用」格式。 在引用文字前加上 > 并与文字保留一个字符的空格,即可。

	引用:
	>Across the Great Wall we can reach every corner in the world.

Across the Great Wall we can reach every corner in the world.

粗体和斜体

Markdown 的粗体和斜体也非常简单: 用两个 * 包含一段文本就是粗体的语法; 用一个 * 包含一段文本就是斜体的语法。

** 粗体 **
* 斜体 *

链接与图片

链接:在 Markdown 中,插入链接

[显示文本] (链接地址)

图片:在 Markdown 中,插入图片只需要使用 

![显示文本] (图片链接地址)即可。

注:插入图片的语法和链接的语法很像,只是前面多了一个 !

音频和视频

插入音频

​<audio id="audio" controls="" preload="none">
      <source id="mp3" src="http://music.163.com/song/media/outer/url?id=469249441.mp3">
</audio>

效果: ​

使用 iframe

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=469249441&auto=1&height=66"></iframe>

效果:

插入视频

一般在视频网站的分享,会提供嵌入代码,直接复制粘贴即可,以B站视频为例

<iframe src="//player.bilibili.com/player.html?aid=69754511&bvid=BV1ZE411D7od&cid=120910162&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>

效果:

但是会发现视频并不能自适应界面,所以需要在ifame上添加样式

style="
	width: 100%; 
    height: 56.25vw; /* 16:9 页面 100*9/16 = 56.25 */"
/* 添加后的标签*/
<iframe src="//player.bilibili.com/player.html?aid=69754511&bvid=BV1ZE411D7od&cid=120910162&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"style="width: 100%; height: 56.25vw; "> </iframe>

效果:

分割线

分割线的语法只需要另起一行,连续输入三个星号 *** 即可分割两段文字内容。 如图:

下面有条分割线
***

下面有条分割线


表格

当你需要在Markdown文稿中键入表格

    | Tables        | Are           | Cool  |
	| ------------- |:-------------:| -----:|
	| col 3 is      | right-aligned | $1600 |
	| col 2 is      | centered      |   $12 |
	| zebra stripes | are neat      |    $1 |

效果

Tables Are Cool
col 3 is right-aligned $1600
col 2 is centered $12
zebra stripes are neat $1

待办和清单

待办事项和清单在日常工作、生活中经常被使用。 在Markdown中,你只需要在待办的事项文本或者清单文本前加上- [ ]、- [x]即可。 - [ ] 表示未完成,- [x] 表示已完成。 注:键入字符与字符之间都要保留一个字符的空格。

- [x] 已完成
- [ ] 未完成
  • 已完成
  • 未完成

流程图

参见:http://knsv.github.io/mermaid/#flowcharts-basic-syntax

甘特图

参见:http://knsv.github.io/mermaid/#styling39

在线书写公式

参见: https://latex.codecogs.com/eqneditor/editor.php

https://zzugbb.github.io/formula-edit/

代码折叠

	<style>
	.testButton { color:black;font-size:12px;padding-top:10px;padding-bottom:10px;padding-left:25px;padding-right:25px;border-width:;border-color:white;border-style:;border-radius:10px;background-color:#f3f3f3;}.testButton:hover{color:white;background-color:#0684bd;border-color:#87daff;}
	</style>
	<button class="testButton" onclick="document.all.child1.style.display=(document.all.child1.style.display =='none')?'':'none'">点击显\隐代码</button>
	<div id="child1" style="display:none"> 

	此处放代码

	</div> 
Heng
Heng
An ordinary person

不擅长研究任何东西,只是刻苦