说明
demo
https://mhlx.github.io/markdown-editor/
changelog(2019-07-06)
- 增加了主题模式，可以设置编辑器的主题、顶部工具栏、底部文字提示、搜索框、工具条和光标辅助框的颜色，点击工具栏的齿轮图标进入
- 增加了TOC，在PC上通过点击工具栏的书本图标进入，在手机端在编辑器页面向右滑动进入
- 手机端现在通过编辑器页面向左滑动预览
下载
https://github.com/mhlx/markdown-editor/releases/latest
Github
https://github.com/mhlx/markdown-editor
文档
https://www.qyh.me/document/markdowneditor
支持的markdown语法
粗体
内容
内容
斜体
内容
内容
链接
图片
狗肉
狗肉
段落
有序
- one
- two
无序
- A list item.
- bar
嵌套
- Abacus
- anser
- Bubbles
- bunk
- bupkis
- bar
- burper
- Cunning
引用
内容
水平线
表格
| A | B | C |
|---|---|---|
| 左对齐 | 居中对齐 | 右对齐 |
锚点
脚注
Markdown[1]
代码
public static void main(String [] args){}
public static void main(String [] args)
{
}
public static void main(String []args){
}
KaTeX
通过KaTeX来渲染LaTex
Inline:
Block:
到这里了解更多
mermaid图表
流程图
graph LR
A-->B
时序图
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
甘特图
gantt
title A Gantt Diagram
dateFormat YYYY-MM-DD
section Section
A task :a1, 2014-01-01, 30d
Another task :after a1 , 20d
具体的使用方法请看这里
感谢
- 使用CodeMirror作为编辑器
- 使用fontawesome美化图标
- 使用highlightjs高亮代码
- 使用jQuery简化dom操作
- 使用sweet2alert作为弹窗提醒
- 使用markdown-it来渲染markdown
- 使用jQuery File Upload来上传文件
- 使用turndown将html转化为markdown
- 使用mermaid渲染流程图、时序图以及甘特图
- 使用morphdom来path更新预览
- 使用katex渲染数学公式
- 使用simplebar美化滚动条
-
内容 ↩
