简介： CSDN博客专家，专注Android/Linux系统，分享多mic语音方案、音视频、编解码等技术，与大家一起成长！

优质专栏：Audio工程师进阶系列【原创干货持续更新中……】🚀
优质专栏：多媒体系统工程师系列【原创干货持续更新中……】🚀

人生格言： 人生从来没有捷径，只有行动才是治疗恐惧和懒惰的唯一良药.

更多原创,欢迎关注：Android系统攻城狮

1.前言

本篇目的：Markdown之YAML效果图语法介绍

2.YAML效果图语法介绍

• YAML 格式广泛的在软件中，使用 PlantUML 可视化数据.
• 以关键字 @startyaml 开始
• 以关键字 @endyaml 结束.

@startyaml
fruit: Apple
size: Large
color: - Red- Green
@endyaml

3.复杂例子

@startyaml
doe: "a deer, a female deer"
ray: "a drop of golden sun"
pi: 3.14159
xmas: true
french-hens: 3
calling-birds: - huey- dewey- louie- fred
xmas-fifth-day: calling-birds: fourfrench-hens: 3golden-rings: 5partridges: count: 1location: "a pear tree"turtle-doves: two
@endyaml

4.使用 symbols 或者 unicode

@startyaml
@fruit: Apple
$size: Large
&color: Red
❤: Heart
‰: Per mille
@endyaml

5.强调

• 正常样式

@startyaml
#highlight "french-hens"
#highlight "xmas-fifth-day" / "partridges"doe: "a deer, a female deer"
ray: "a drop of golden sun"
pi: 3.14159
xmas: true
french-hens: 3
calling-birds: - huey- dewey- louie- fred
xmas-fifth-day: calling-birds: fourfrench-hens: 3golden-rings: 5partridges: count: 1location: "a pear tree"turtle-doves: two
@endyaml

• 自定义样式

@startyaml
<style>
yamlDiagram {highlight {BackGroundColor redFontColor whiteFontStyle italic}
}
</style>
#highlight "french-hens"
#highlight "xmas-fifth-day" / "partridges"doe: "a deer, a female deer"
ray: "a drop of golden sun"
pi: 3.14159
xmas: true
french-hens: 3
calling-birds: - huey- dewey- louie- fred
xmas-fifth-day: calling-birds: fourfrench-hens: 3golden-rings: 5partridges: count: 1location: "a pear tree"turtle-doves: two
@endyaml

6.使用不同的样式高亮

@startyaml
<style>.h1 {BackGroundColor greenFontColor whiteFontStyle italic}.h2 {BackGroundColor redFontColor whiteFontStyle italic}
</style>
#highlight "french-hens" <<h1>>
#highlight "xmas-fifth-day" / "partridges" <<h2>>doe: "a deer, a female deer"
ray: "a drop of golden sun"
pi: 3.14159
xmas: true
french-hens: 3
calling-birds: - huey- dewey- louie- fred
xmas-fifth-day: calling-birds: fourfrench-hens: 3golden-rings: 5partridges: count: 1location: "a pear tree"turtle-doves: two
@endyaml

7.使用 (global) 全局样式

• 不带样式 (默认模式)

@startyaml-name: Mark McGwirehr:   65avg:  0.278-name: Sammy Sosahr:   63avg:  0.288
@endyaml

• 使用样式 style 更改元素的显示.

@startyaml
<style>
yamlDiagram {node {BackGroundColor lightblueLineColor lightblueFontName HelveticaFontColor redFontSize 18FontStyle boldBackGroundColor KhakiRoundCorner 0LineThickness 2LineStyle 10-5separator {LineThickness 0.5LineColor blackLineStyle 1-5}}arrow {BackGroundColor lightblueLineColor greenLineThickness 2LineStyle 2-5}
}
</style>-name: Mark McGwirehr:   65avg:  0.278-name: Sammy Sosahr:   63avg:  0.288
@endyaml