在阅读此篇博文时,你应该已经掌握了MarkDown的基础语法和基本使用,如果还没有掌握,请先阅读我之前写的博文MarkDown语法一,本篇博文将教授大家MarkDown的高级使用,比如用MarkDown制作流程图,图片大小的调整,图片链接等
声明
MarkDown的高级使用,有些功能属于拓展语法,可能存在某些平台的编译器无法识别的情况
MarkDown图片大小
使用{:width=”100” height=”100”} 或者使用HTML格式控制图片显示大小,有宽度(width)和高度(height)两个属性,如果只指定一个,则另一个会等比例缩放。
height属性在某些编译器上不生效
![Alee](http://www.aleej.com/img/cannondale_twitter.png)
<img src="http://www.aleej.com/img/cannondale_twitter.png" width="50" height="100"/>
![Alee](http://www.aleej.com/img/cannondale_twitter.png){:width="100"}
![Alee](http://www.aleej.com/img/cannondale_twitter.png){:height="150"}
显示效果:
参考试链接
如果在一篇博文中有多出需要引用一个链接,可以使用参考试链接来减少字符数量提高效率。
定义:[id]: 链接地址 “提示文本” 提示文本可以不要
使用:[文本][id]
//使用
[Alee的博客][Alee]
//定义
[Alee]: http://www.aleej.com
[Alee]: http://www.aleej.com "Alee Blog"
显示效果:
自动链接
通过<url>定义
<http://www.aleej.com>
显示效果:
图片链接
图片链接就是把图片和链接嵌套
格式:[![文本](图片地址)](图片链接地址 “提示文本”) 提示文本可以不要
[![Alee](http://www.aleej.com/img/cannondale_twitter.png)](http://www.aleej.com "点击访问Alee Blog")
显示效果:
在新标签页打开链接
在所有链接后面加上{:target=”_blank”} 或者使用HTML语法
[Alee Blog][Alee]{:target="_blank"}
[Alee](http://www.aleej.com/about){:target="_blank"}
<http://www.aleej.com>{:target="_blank"}
[![Alee](http://www.aleej.com/img/cannondale_twitter.png){:width="50"}](http://www.aleej.com "点击访问Alee Blog"){:target="_blank"}
<a href="http://www.baidu.com" target="_blank">新窗口打开百度</a>
显示效果:
流程图
通过代码段的方式引入流程图 语言为flow
```flow
//your code
```
示例:
```flow
st=>start: 点击登录 :>http://www.aleej.com
op1=>operation: 判断用户名和密码是否填写
op2=>operation: 校验用户名和密码是否规范填写
op3=>operation: 请求服务器判断用户名和密码是否正确
sub1=>subroutine: 提示用户名密码未填写
sub2=>subroutine: 提示用户名密码填写不规范
sub3=>subroutine: 提示用户名密码填写不正确
con1=>condition: 是否填写
con2=>condition: 是否规范
con3=>condition: 是否正确
io=>inputoutput: 重新输入
en=>end: 结束 登录成功
st->op1->con1
con1(yes,right)-op2->con2
con1(no)->sub1->io->op1
con2(yes,right)->op3->con3
con2(no)->sub2->io->op1
con3(yes,right)->en
con3(no)->sub3->io->op1
```
显示效果:(部分编译器可能不识别)
st=>start: 点击登录 :>http://www.aleej.com
op1=>operation: 判断用户名和密码是否填写
op2=>operation: 校验用户名和密码是否规范填写
op3=>operation: 请求服务器判断用户名和密码是否正确
sub1=>subroutine: 提示用户名密码未填写
sub2=>subroutine: 提示用户名密码填写不规范
sub3=>subroutine: 提示用户名密码填写不正确
con1=>condition: 是否填写
con2=>condition: 是否规范
con3=>condition: 是否正确
io=>inputoutput: 重新输入
en=>end: 结束 登录成功
st->op1->con1
con1(yes,right)-op2->con2
con1(no)->sub1->io->op1
con2(yes,right)->op3->con3
con2(no)->sub2->io->op1
con3(yes,right)->en
con3(no)->sub3->io->op1
声明元素
格式:tag=>type: content :>url
规则:
- tag 设置元素名称
- => 元素定义符
- type: 设置元素类型,共6种类型
- start: 开始,圆角矩形
- end: 结束,圆角矩形
- operation: 操作/行动方案,普通矩形
- subroutine: 子主题/模块,双边线矩形
- condition: 条件判断/问题审核,菱形
- inputoutput: 输入输出,平行四边形
- content 设置元素显示内容,中英均可
- :>url 设置元素链接,可选,后接[blank]可以新建窗口打开
须知:注意空格,
=>
前后都不能接空格,type:
后必须接空格,:>
是语法标记,中间不能有空格
定义流程
格式:tag1(branch,direction)->tag2
规则:
- -> 流程定义符,连接两个元素
- branch 设置 condition 类型元素的两个分支,有 yes/no 两个值,其他元素无效
- direction 定义流程走线方向,有 left/right/top/bottom 四个值,所有元素有效,此项配置可选
须知:
- 注意空格,
->
前后都不能有空格- 由于condition类型有两个分支,我们一般遇到condifiton元素时就换行,例如
st->op1->c2 c2(yes)->io->e c2(no)->op2->e
LaTex
格式:$$回车LaTex代码回车$$
$$
y= \begin{cases}
-x,\quad x\leq 0 \\
x,\quad x>0
\end{cases}
$$
显示效果: \(y= \begin{cases} -x,\quad x\leq 0 \\ x,\quad x>0 \end{cases}\)