怎样做网站管理网站开发流程的8个步骤
Markdown 常用技巧笔记
Mermaid的使用
在 Markdown 中使用 Mermaid 的 graph TD（流程图）非常简单，以下是详细操作指南：
一、基础使用方法
-
创建 Mermaid 代码块：
```mermaid graph TDA[开始] --> B[处理数据]B --> C{判断}C -->|是| D[执行操作]C -->|否| E[结束] -
渲染效果：
Typora 会自动将代码渲染为流程图：
二、核心语法详解
1. 节点定义
graph TDA --> B // 实线箭头A -.-> C // 虚线箭头A == text ==> D // 粗线带文字A -- text --> E // 实线带文字
2. 方向控制
| 代码 | 方向 | 示例 |
|---|---|---|
graph TD | 从上到下 | A --> B |
graph LR | 从左到右 | A --> B |
graph RL | 从右到左 | A --> B |
graph BT | 从下到上 | A --> B |
三、高级功能技巧
1. 使用子图
```mermaid
graph TDA --> Bsubgraph 子系统 [子图标题]C --> DD --> EendB --> C
```
2. 自定义样式
3. 超链接支持
四、常见问题解决
1. 流程图不渲染
- 检查 Typora 设置：
文件>偏好设置>Markdown> 确保启用 Mermaid - 确认代码块标记为
```mermaid而非```graph
2. 中文显示异常
3. 复杂布局优化
五、实用示例模板
六、Typora 专属技巧
- 即时预览：输入时自动渲染，
Ctrl + /切换源码视图 - 导出支持：导出 PDF/HTML 时保留流程图
- 主题适配：流程图颜色会自动匹配 Typora 当前主题
- 快捷键：输入
```m后按Tab快速生成代码块
提示：Typora ≥ v1.0 版本默认支持 Mermaid，旧版本需升级或安装插件。对于复杂流程图，建议先用 Mermaid Live Editor 在线调试后再粘贴到 Typora。
数学符号
下标：loffset ； 语法：
I<sub>offset</sub>
上标和下标：NSymbolslot ; 语法：
N<sub>Symbol</sub><sup>slot</sup>