Markdwon学习笔记[基础 + 进阶 + 应用]

Markdown 使用手册

1. 简介

Markdown 是一种易读易写的文本标记语言,它可以用简单的语法代替Word中的格式按钮操作,是记笔记、写文档的理想语法

Markdown 编辑器

  • typora (Win/Mac)
  • Mou (Mac)

Markdown 线上编辑器

  • DILLNGER

支持Markdwon的网站

  • Github
  • 简书
  • 印象笔记

2. 基本语法

Element Markdown example Remarks
多级标签 # 一级标签
## 二级标签
### 三级标签
加粗 *加粗* 加粗 快捷键:Ctrl + B
斜体 *斜体* 斜体 快捷键:Ctrl + I
加粗且斜体 *** *** 加粗且斜体
删除线 ~~ ~~ 删除线
文本引用 >
代码引用 ```
无序列表 * + -
有序列表 1.
分隔线
插入图片 ![](img_path)
链接 []()
<>
Markdown Guide
表格 |title1|title2|
|-------|-------|
|content|content|
|左对齐|居中对齐|右对齐
|:---------|:------------------
|1 |2 |3 |
To do list - []

3. Markdown 进阶

  • Markdwon + HTML

    • 更改图片显示大小

    • 更改字体

      灰色字体

      灰色字体

      属性
      face 字体
      color 颜色
      size 大小
  • Markdown + Latex 数学公式

常用数学符号的LaTeX表示方式

关键字: $…$ 或 $$ + 回车

example:

$$\sum_{x=1}^{100} x+x^2$$

∑ x = 1 100 x + x 2 \sum_{x=1}^{100} x+x^2 x=1100x+x2

  • 用Markdown画流程图

    绘制图标的功能是Markdown的扩展功能,标准的Markdown并不支持

    关键字 图标
    flow 流程图
    sequence 序列图
    mermaid 流程图/甘特图
    • 流程图

      基于 flowchart.js

      example

    #定义结点
    st=>start: Start
    op=>operation: gender
    cond=>condition: MALE or FEMALE?
    e=>end: End
    
    #定义结点关系
    st->op->cond
    cond(yes)->e
    cond(no)->op
    
    #小tips
    st->op(right)->cond  表示gender的右侧作为线尾指向cond这个元素
    st->op(left)->cond   表示gender的左侧作为线尾指向cond这个元素
    
    
Created with Raphaël 2.2.0 Start gender MALE or FEMALE? End yes

语法

tag=>type: content:>url

类型
start 开始
end 结束
operation 操作
subroutine 子程序
condition 条件
inputoutput 输入输出
  • 用Markdown 制作线上ppt
    remark.js

    git 项目

    官方实例

    
    <html>
      <head>
        <title>Titletitle>
        <meta charset="utf-8">
        <style>
          @import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
          @import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic);
          @import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic);
    
          body { font-family: 'Droid Serif'; }
          h1, h2, h3 {
            font-family: 'Yanone Kaffeesatz';
            font-weight: normal;
          }
          .remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; }
        style>
      head>
      <body>
        <textarea id="source">
    
    class: center, middle
    
    # Title
    
    ---
    
    # Agenda
    
    1. Introduction
    2. Deep-dive
    3. ...
    
    ---
    
    # Introduction
    
        textarea>
        <script src="https://remarkjs.com/downloads/remark-latest.min.js">
        script>
        <script>
          var slideshow = remark.create();
        script>
      body>
    html>
    

5 参考资料

  • Markdown Guide
  • Markdown 高级操作
  • Draw Diagrams with Markdown

你可能感兴趣的:(学习笔记)