✏️Markdown Notes(Chinese)

〇、使用什么来学习 Link to heading

0.1 Typora Link to heading

所见即所得的一款免费而好用的编辑器。

0.2 VS Code Link to heading

宇宙最强大的编辑器

一、基础语法 Link to heading

1.1 标题的使用 Link to heading

# 文档标题

作者

摘要

目录

## 标题1

### 标题1.1

## 标题2

###标题2.2

1.2 粗体与斜体 Link to heading

粗体斜体

**粗体**
*斜体*

1.3 段落与换行 Link to heading

空一行才是换了段落
如果段内要换行（软回车）需要在上一行的末尾插入两个以上的空格再回车

1.4 列表 Link to heading

有序列表
```
数字符号+.+ +内容
```
如果列表有换行，在.之前应该有两个空格
无序列表
```
-+ +内容
```
如果列表有换行，应该有三个空格

嵌套列表

第一层
Tab+第二层
Tab +Tab +第三层

注意

如果列表都只是一行，建议之间别空行

如果列表有很多行，建议列表之间空一行

首尾最好都空一行

1.5 分割线 Link to heading

三个以上的---

1.6 图片 Link to heading

！[无法显示图片的代替文字]（地址）

1.7 链接 Link to heading

标准写法：[链接文字]（链接地址）

引用写法：[链接文字]
[链接文字]:地址

网页链接
<链接地址>

1.8 代码块 Link to heading

行内代码用` `

代码块:
```c++
```

建议：若有输出内容，可以在输入的内容前加上$

1.9 引用 Link to heading

>+引用的内容

可以多层引用

比如这里有个第二层

二、GFM语法 Link to heading

2.1 删除线 Link to heading

~~删除的文字~~

如删除

2.2 表情 Link to heading

：表情：

如🥚

2.3 表格 Link to heading

基本样式
| 这是表格的一半    | 这是表格的另一半 |
| ----------------- | ---------------- |
| 这是一个2*2的表格 | 你没有看错       |

这是表格的一半	这是表格的另一半
这是一个2*2的表格	你没有看错

左对齐 :—-
右对齐 —-:
居中对齐 :—-:

2.4 任务列表 Link to heading

- [x] 已完成
- [ ] 还没完成

已完成
还没完成

2.5 锚点 Link to heading

[锚点描述]（#锚点名字）

回到目录

三、更好的使用Typora Link to heading

3.1 Typora的拓展语法 Link to heading

3.1.1 下划线 Link to heading

语法：<u>这段文字有下划线</u>

样例：这段文字有下划线

快捷键：Ctrl+U

3.1.2 内联数学公式 Link to heading

$公式$

比如在这句话内联$\frac{-b\pm \sqrt{b^2-4ac}}{2a}$一个求根公式

3.1.3 上下标 Link to heading

~下标~
^上标^

H2O与X^2^

3.1.4 高亮 Link to heading

==light==

==light==

3.1.5 注释 Link to heading

<!--我是导出不显示的注释-->

3.1.6 脚注 Link to heading

脚注是这样添加的[^参考]
[^参考]：这是对这段文字的描述

脚注是这样添加的¹

3.1.7 清除样式 Link to heading

使用Ctrl+\可以清除样式

3.2 基础的图表功能(基于Mermaid) Link to heading

注意：只支持在Typora中使用

3.2.1 序列图 Link to heading

```mermaid
mermaid 序列图语法
```

下图源代码
sequenceDiagram
张三->李四:好久不见？
note right of 李四:李四和王五说
李四->>王五:张三说的对啊！
王五-->张三:对啊对啊！

sequenceDiagram
张三->李四:好久不见？
note right of 李四:李四和王五说
李四->>王五:张三说的对啊！
王五-->张三:对啊对啊！

3.2.2 流程图 Link to heading

```flow
mermaid流程图语法
```

下图源代码
graph TD
A(开始)-->B[流程1]
B-->C{判断框}
C-->|yes|D(结束)
C-->|No|B

graph TD
A(开始)-->B[流程1]
B-->C{判断框}
C-->|yes|D(结束)
C-->|No|B

3.2.3 甘特图 Link to heading

```mermaid
Mermaind甘特图语法
```

下图源码
gantt
dateFormat YYYY-MM-DD
title 项目开发周期
section 需求评审
开始阶段:  2018-01-01,2018-01-02
section 功能开发
准备阶段: 2020-03-18,2020-05-01

gantt
dateFormat YYYY-MM-DD
title 项目开发周期
section 需求评审
开始阶段:  2018-01-01,2018-01-02
section 功能开发
准备阶段: 2020-03-18,2020-05-01

3.3 一些实用的功能 Link to heading

3.3.1 查找和替换 Link to heading

快捷键

Ctrl+F：查找面板

F3：下一个

Shift+F3：上一个

Ctrl+H：替换面板

3.3.2 图片管理 Link to heading

可以开启复制到指定文件夹便于管理
支持直接右键开启缩放图片

3.3.3 显示模式 Link to heading

F11:全屏

F9：打字机

F8：专注模式

四、更好的使用VS Code Link to heading

~~不会吧，不会吧，有程序员不会用vs code吗？~~

4.1 插件：MPE Link to heading

4.1.1 引用文件 Link to heading

@import "文件名"

支持md，csv，jpg，png，gif，html，pdf

4.1.2 幻灯片 Link to heading

<!-- slide -->来分页

切换主题

将代码放在文件头部

---
presentation:
 theme: solarized.css
---

4.2 更好的编辑 Link to heading

4.2.1 语法检查 Link to heading

使用：markdownlint插件

4.2.2 拼写检查 Link to heading

使用code spell Checker插件

4.2.3 插入图片 Link to heading

“截图”–>“粘贴”

方法1：命令行[paste image]

方法2：Ctrl+Alt+V

4.2.4 禅模式 Link to heading

开启：命令行内搜索禅

关闭：fn+esc

五、reveal.js(写幻灯片) Link to heading

5.1 准备开始 Link to heading

5.1.1 下载 Link to heading

需要先有git、Node.js。

下载reveal.js

git clone https://github.com/hakimel/reveal.js.git

5.1.2 配置环境 Link to heading

安装依赖的模块
```
npm install
```
启动web服务
```
npm start
```

5.2 初步了解 Link to heading

5.2.1 基本结构 Link to heading

<!doctype html>
<html>
 <head>
  <link rel="stylesheet" href="dist/reveal.css">
  <!-- 这里可以修改幻灯片主题 -->
  <link rel="stylesheet" href="plugin/highlight/monokai.css" id="highlight-theme">
 </head>
    
 <body>
  <div class="reveal">
   <div class="slides">
                <!-- 在section中编写幻灯片的内容 -->
    <section>Slide 1</section>
    <section>Slide 2</section>
   </div>
  </div>

  <script src="plugin/highlight/highlight.js"></script>
  <script>
   //这里修改幻灯片配置
   Reveal.initialize({});
  </script>
 </body>
</html>

5.2.2 幻灯片结构 Link to heading

<!-- 最外层水平幻灯片-->
<section>
 <section data-markdown>
     <textarea data-template>
         ## 我是第一页
        </textarea>
    </section>

</section>

5.2.3 如何使用markdown Link to heading

1）在HTML中直接使用

<section data-markdown>
 <textarea data-template>
    # 我们的内容
    </textarea>
</section>

HTML文件中调用外部的markdown文件

<section data-markdown="外部文件md">
 指定分页规则
</section>

5.2.4 js的依赖 Link to heading

 <script src="dist/reveal.js"></script>
 <script src="plugin/notes/notes.js"></script>
 <script src="plugin/markdown/markdown.js"></script>
 <script src="plugin/highlight/highlight.js"></script>
 <script>
  Reveal.initialize({
   hash: true,
   plugins: [RevealMarkdown, RevealHighlight, RevealNotes]
  });
 </script>

5.3 示范代码 Link to heading

<html>

<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

 <title>reveal.js</title>
 <link rel="stylesheet" href="dist/reset.css">
 <link rel="stylesheet" href="dist/reveal.css">
 <link rel="stylesheet" href="dist/theme/black.css" id="theme">

 <!-- Theme used for syntax highlighted code -->
 <link rel="stylesheet" href="plugin/highlight/monokai.css" id="highlight-theme">
</head>

<body>
 <div class="reveal">
  <div class="slides">
   <section data-markdown>
    <textarea data-template>
    # 第一次用md写ppt
    作者：沈悟为
    </textarea>
   </section>
   <section data-markdown>
    <textarea data-template>
    本年度的报表
    1. 我们获得了更多的资金
    2. 我们成功上市
    </textarea>
   </section>
  </div>
 </div>

 <script src="dist/reveal.js"></script>
 <script src="plugin/notes/notes.js"></script>
 <script src="plugin/markdown/markdown.js"></script>
 <script src="plugin/highlight/highlight.js"></script>
 <script>
  Reveal.initialize({
   hash: true,
   plugins: [RevealMarkdown, RevealHighlight, RevealNotes]
  });
 </script>
</body>

</html>

附录 Link to heading

附录1：排版 Link to heading

空格的使用

英文标点之后需要加空格
使用 > 是两边都要加空格
数字与单位之间不加空格
货币之后不加空格

全角与半角

中文全角标点占位比英文半角标点宽

附录2：实用工具 Link to heading

记笔记

notion（个人正在使用的笔记平台）
印象笔记（据说不错）
有道云笔记（国内大厂）

多人协助

Teambition（阿里的，除了网盘还没开放基本可以说是完美）
腾讯文档（只要用QQ、微信，应该哪里都能看到吧）
石墨文档

博客

gitpgae（免费搭建个人博客平台）
CSDN(程序员)
知乎、简书等

微信公众号

online-Markdown
MD2All

写邮件

Markdown Here

交互式文档

Jupyter Notebook

写书

Gitbook

这是对这段文字的描述 ↩︎