Markdown使用

Markdown相关小抄

Posted by nomadli on December 2, 2015

Markdown

  1. markdown 可以直接添加html标记语句 如<pre><code>
  2. # 1-6空格 6级标题
  3. > 文本前面>标示引用句子
  4. 插入链接。前面加!插入图片
  5. 斜体 粗体 斜粗体 带删除线 下划线
  6. -无序列表
  7. 数字. 有序列表
  8. ---分隔符
  9. 换行前一行末尾两个空格换行
  10. 四空格缩进或使用html标记代码块
  11. $$TeX 或 LaTeX 格式的数学公式$$
  12. * content{:toc}生成目录
  13. <> 显示括号中的地址,并生成超链接
  14. 表格

    title1|title2|title3
    :--|--:|:--:
    c1|c2|c3
    

GFM

  1. 显示地址并生成超链接 直接输入无需括号
  2. '''name ''' 代码块,bash, cmake, cpp, go, java, json, lua, markdown, perl, python, sql。 单个'在文本中插入代码
  3. 对变量命中带_线的单词不会解析为粗体

Word

  • brew install pandoc
  • pandoc -s xx.docx -t markdown -o xx.md

Mermaid

  • TB BT LR RL
  • 流程图
graph TB;
	subgraph one
		A[xxxxxx]-.bbbb.->B(yyy);
		A-.->C((zzz));
    end
	B-->|aaaa|D>hhhh];
	C==>D;
	D---|bbbb|E{aaa};
graph TD
	A[矩形] --> B(圆角) --> C{菱形}
	D([This is the text in the box]) --> E[[带边框的矩形]] --> F[\平行四边形\]
	G --> H((圆形)) --> I[/平行四边形/]
	J>非对称图形] --> K[/梯形\] --> L[\梯形/]
	M[(圆柱形)]
graph LR

o(群里提问的艺术)
o1(提问之前)
o11(尝试自己解决)
o111(搜索也是一门艺术)
o1111(Baidu)
o1112(Google)
o112(查阅手册或者文档)
o113(查阅论坛或者社区)
o1131(github)
o1132(stackoverflow)
o114(查阅源代码)
o115(询问朋友)
o116(自检并且不断尝试)
o12(不能自己解决)
o121(明白自己想问什么)
o122(梳理准备你的问题)
o123(言简意赅)
o2(怎样提问)
o21(用词准确, 问题明确)
o22(描述准确, 信息充足)
o221(准确有效的信息)
o222(问题内容)
o223(做过什么尝试)
o224(想要问什么)
o23(别问毫无意义的问题)
o231(有没有人在)
o232(有没有人会)
o3(注意事项)
o31(提问前做好冷场的心理准备)
o311(也许这个问题网上搜一下就知道答案)
o312(也许别人在忙)
o313(也许这个问题太简单了)
o314(也许没人做过这个)
o32(谦虚, 别人没有义务为你解决问题)
o33(没有一定的学习能力, 遇到问题只会伸手的不适合玩这个)
o34(群唯一的作用: 扯淡, 交流, 分享, 以上几条为前提)

o --- o1
o --- o2
o --- o3
o1 --- o11
o1 --- o12
o2 --- o21
o2 --- o22
o2 --- o23
o3 --- o31
o3 --- o32
o3 --- o33
o3 --- o34
o11 --- o111
o111 -.- o1111
o111 -.- o1112
o11 --- o112
o11 --- o113
o113 -.- o1131
o113 -.- o1132
o11 --- o114
o11 --- o115
o11 --- o116
o12 --- o121
o12 --- o122
o12 --- o123
o22 --- o221
o22 --- o222
o22 --- o223
o22 --- o224
o23 --- o231
o23 --- o232
o31 --- o311
o31 --- o312
o31 --- o313
o31 --- o314

style o fill:black,stroke:black,stroke-width:1px,color:white
style o1 fill:#f22816,stroke:#f22816,stroke-width:1px,color:white
style o2 fill:#f2b807,stroke:#f2b807,stroke-width:1px,color:white
style o3 fill:#233ed9,stroke:#233ed9,stroke-width:1px,color:white
style o11 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o12 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o111 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o112 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o113 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o114 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o115 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o116 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o121 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o122 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o123 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o1111 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o1112 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o1131 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o1132 fill:#fcd4d0,stroke:#fcd4d0,stroke-width:1px
style o21 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o22 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o221 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o222 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o223 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o224 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o23 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o231 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px
style o232 fill:#fcf1cd,stroke:#fcf1cd,stroke-width:1px

linkStyle 0 stroke:#f22816,stroke-width:5px;
linkStyle 1 stroke:#f2b807,stroke-width:5px;
linkStyle 2 stroke:#233ed9,stroke-width:5px;
linkStyle 3 stroke:#f22816,stroke-width:3px;
linkStyle 4 stroke:#f22816,stroke-width:3px;
linkStyle 5 stroke:#f2b807,stroke-width:3px;
linkStyle 6 stroke:#f2b807,stroke-width:3px;
linkStyle 7 stroke:#f2b807,stroke-width:3px;
linkStyle 8 stroke:#233ed9,stroke-width:3px;
linkStyle 9 stroke:#233ed9,stroke-width:3px;
linkStyle 10 stroke:#233ed9,stroke-width:3px;
linkStyle 11 stroke:#233ed9,stroke-width:3px;
  • 状态图
      stateDiagram-v2
          [*] --> Still: 开始
          Still --> [*]:退回
            
      	Still --> Moving
          Moving --> Still
        
      	Moving --> Crash
          Crash --> [*]
    
      stateDiagram-v2
      [*] --> First
      First --> Second
      First --> Third
    	
      state First {
          [*] --> fir
          fir --> [*]
      }
      state Second {
          [*] --> sec
          sec --> [*]
      }
      state Third {
          [*] --> thi
          thi --> [*]
      }
    
  • 时序图
      sequenceDiagram
          participant A
          participant B
      	A->B: 吃了吗?
          B-->A: 吃了.
          B->>A: 你吃了吗?
          A-->>B: 我也吃了。
          A-xB: 以后别问我。
          B--xA: 疯了一个。
          loop 强迫模式
          	 A->B: 你傻吗?
          	 B-->A: 你才傻。
          	 Note left of A: 继续骂?
          	 alt 继续骂
          	 	A->B: 尻
          	 else 不继续
          	 	A->B: 不跟你计较
          	 end
          	 opt 管你继续不继续
          	 	B->A: 尻
          	 end
          end
    
  • 甘特图
gantt
    dateFormat  YYYY-MM-DD
    title 上面是日期格式、这是标题
    
    section 模块A
    已完成            :done,    des1, 2014-01-06,2014-01-08
    正在进行          :active,  des2, 2014-01-09, 3d
    待处理            :         des3, after des2, 5d
    待处理2           :         des4, after des3, 5d
    
    section 模块B
    已完成关键阶段 	:crit, done, 2014-01-06,24h
    已完成关键阶段2    :crit, done, after des1, 2d
    正在进行的关键阶段  :crit, active, 3d
    5天的关键阶段任务   :crit, 5d
    两天的任务         :2d
    一天的任务                      :1d
    
    section Documentation
    Describe gantt syntax               :active, a1, after des1, 3d
    Add gantt diagram to demo page      :after a1  , 20h
    Add another diagram to demo page    :doc1, after a1  , 48h

    section Last section
    Describe gantt syntax               :after doc1, 3d
    Add gantt diagram to demo page      : 20h
    Add another diagram to demo page    : 48h
  • 类结构

      classDiagram
            Animal <|-- Duck
            Animal <|-- Fish
            Animal <|-- Zebra
            Animal : +int age
            Animal : +String gender
            Animal: +isMammal()
            Animal: +mate()
            class Duck{
                +String beakColor
                +swim()
                +quack()
            }
            class Fish{
                -int sizeInFeet
                -canEat()
            }
            class Zebra{
                +bool is_wild
                +run()
            }
    
  • 饼图

      pie
          "Dogs" : 386
          "Cats" : 85
          "Rats" : 150 
    
  • git提交

      gitGraph:
      options
      {
          "nodeSpacing": 150,
          "nodeRadius": 10
      }
      end
      commit
      branch newbranch
      checkout newbranch
      commit
      commit
      checkout main
      commit
      commit
      merge newbranch
    
  • 日程

      journey
          title My working day
          section Go to work
            Make tea: 5: Me
            Go upstairs: 3: Me
            Do work: 1: Me, Cat
          section Go home
            Go downstairs: 5: Me
            Sit down: 5: Me
    
  • 思维导图
          mindmap
              A
                  B
                      D
                      E
                  C
                      F
                      G
    
  • UML
      zenuml
          title image sample1
          @Actor Actor
          @Boundary Boundary
          @Control Control
          @Database Database
          @Entity Entity
          @CloudWatch CloudWatch
    
      zenuml
          title image sample2
          @CloudFront CloudFront
          @Cognito Cognito
          @DynamoDB DynamoDB
          @EBS EBS
          @EC2 EC2
          @ECS ECS
    
      zenuml
          title image sample3
          @EFS EFS
          @ElastiCache ElastiCache
          @ElasticBeantalk ElasticBeantalk
          @Glacler Glacler
          @IAM IAM
          @Kinesis Kinesis
    
      zenuml
          title image sample4
          @Lambda Lambda
          @LightSail LightSail
          @RDS RDS
          @Redshift Redshift
          @S3 S3
          @SNS SNS
    
      zenuml
          title image sample5
          @SQS SQS
          @Sagemaker Sagemaker
          @VPC VPC
          @AzureActiveDirectory AzureActiveDirectory
          @AzureBackup AzureBackup
          @AzureCDN AzureCDN
    
      zenuml
          title image sample5
          @AzureDataFactory AzureDataFactory
          @AzureDevOps AzureDevOps
          @AzureFunction AzureFunction
          @AzureSQL AzureSQL
          @CosmosDB CosmosDB
          @LogicApps LogicApps
    
      zenuml
          title image sample5
          @VirtualMachine VirtualMachine
          @BigTable BigTable
          @BigQuery BigQuery
          @CloudDNS CloudDNS
          @CloudInterconnect CloudInterconnect
          @CloudLoadBalancing CloudLoadBalancing
    
      zenuml
          title image sample5
          @CloudSQL CloudSQL
          @CloudStorage CloudStorage
          @DataLab DataLab
          @DataProc DataProc
          @GoogleIAM GoogleIAM
          @GoogleSecurity GoogleSecurity
    
      zenuml
          title image sample5
          @GoogleVPC GoogleVPC
          @PubSub PubSub
          @SecurityScanner SecurityScanner
          @StackDriver StackDriver
          @VisionAPI VisionAPI
    

flowchart

  • 定义元素 tag=>type: content:>url
  • tag 元素标签用于流程时引用元素
  • type 元素类型
    • start 开始
    • end 结束
    • operation 操作
    • subroutine 子程序
    • parallel 平行程序 标签(path1, bottom)-> 标签(path2, top)->
    • condition 条件 标签(yes)-> 标签(no)->
    • inputoutput 输入输出
  • url 点击跳转链接
  • 流程定义 标签A->标签B
a=>start: Start:>http://www.google.com[blank]
b=>operation: My Operation
c=>subroutine: My Subroutine
d=>condition: Yes or No?:>http://www.google.com
e=>inputoutput: catch something...
f=>parallel: parallel tasks
g=>end:>http://www.google.com
a->b->d
d(yes, bottom)->e->g
d(no, right)->f
f(path1, bottom)->c(right)->b
f(path2, top)->b

echarts

{ 
    "chartWidth": 500, 
    "chartHeight": 400, 
    "series": [ 
    { 
        "name": "访问来源", 
        "type": "pie", 
        "radius": "55%", 
        "data": [ 
        { 
            "value": 235, 
            "name": "视频广告" 
        }, 
        { 
            "value": 274, 
            "name": "联盟广告" 
        }, 
        { 
            "value": 310, 
            "name": "邮件营销" 
        }, 
        { 
            "value": 335, 
            "name": "直接访问" 
        }, 
        { 
            "value": 400, 
            "name": "搜索引擎" 
        } 
        ] 
    } 
    ] 
} 

sequence

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!

latex

  • 行使用$…..$
  • 块(独立于行) $$….$$
  • 多行公式 $$\begin{align} …… \end{align}$$
  • 命令 \ 开头
  • 参数{….} 如 \frac{a}{b}
  • 上标 ^… 如 a^2
  • 下标 _… 如 a_1
  • 百分号 \%
  • 加减乘除 + - \times \div
  • 分数 \frac{a}{b}
  • 比较 \equiv \neq \leq \geq \approx \sim
  • 根号 \sqrt{….} \sqrt[n]{….}
  • 指数 x^2 e^{i\pi}
  • 三角函数 \sin \cos \tan
  • 对数 \log \ln
  • 求和 \sum_{i=1}^{n}
  • 乘积 \prod
  • 积分 \int_{a}^{b}
  • 极限 \lim_{x \to 0}
  • 无穷 \infty
  • 集合属于 \in \notin
  • 集合包含 \subset \supset
  • 集合交并 \cap \cup
  • 集合空集 \emptyset
  • 矩阵 \begin{pmatrix} a & b… \ c & d… … \end{pmatrix} p圆括号 b方括号 v行列式
  • 希腊字母 小写|大写|LaTeX|小写|大写|LaTeX :–:|:–:|:–:|:–:|:–:|:–: α|Α|\alpha|ν|Ν|\nu β|Β|\beta|ο|Ο|\o γ|Γ|\gamma|π|Π|\pi δ|Δ|\delta|ρ|Ρ|\rho ε|Ε|\epsilon|σ|Σ|\sigma θ|Θ|\theta|τ|Τ|\tau λ|Λ|\lambda|φ|Φ|\phi μ|Μ|\mu|ω|Ω|\omega