做一个Markdown页面渲染测试
欢迎使用 Arya
在线 Markdown 编辑器
Arya,是一款基于
Vue
、Vditor
,为未来而构建的在线 Markdown
编辑器;轻量且强大:内置粘贴 HTML 自动转换为
Markdown,支持流程图、甘特图、时序图、任务列表,可导出携带样式的图片、PDF、微信公众号特制的
HTML 等等。
如何使用
微注:清空目前这份默认文档,即处于可使用态。Arya 另一大优点在于:编辑内容只会在您本地进行保存,不会上传您的数据至服务器,绝不窥测用户个人隐私,可放心使用;Github 源码:markdown-online-editor,部分功能仍在开发🚧,敬请期待。
默认为所见即所得模式,可通过
⌘-⇧-M
(Ctrl-⇧-M
)进行切换;或通过以下方式:
- 所见即所得:
⌘-⌥-7
(Ctrl-alt-7
); - 即时渲染:
⌘-⌥-8
(Ctrl-alt-8
); - 分屏渲染:
⌘-⌥-9
(Ctrl-alt-9
);
PPT 预览
如果您用作 PPT
预览(入口在
设置
中),需要注意,这里暂还不能支持各种图表的渲染;您可以使用
---
来定义水平方向上幻灯片,用 --
来定义垂直幻灯片;更多设定可以参见 RevealJs
文档。
什么是 Markdown
Markdown 是一种方便记忆、书写的纯文本标记语言,用户可以使用这些标记符号,以最小的输入代价,生成极富表现力的文档:譬如您正在阅读的这份文档。它使用简单的符号标记不同的标题,分割不同的段落,粗体、斜体 或者超文本链接,更棒的是,它还可以:
1. 制作待办事宜 Todo
列表
2. 书写一个质能守恒公式[^LaTeX]
3. 高亮一段代码[^code]
1 | // 给页面里所有的 DOM 元素添加一个 1px 的描边(outline); |
4. 高效绘制流程图
graph TD; A-->B; A-->C; B-->D; C-->D;
5. 高效绘制序列图
sequenceDiagram participant Alice participant Bob Alice->John: Hello John, how are you? loop Healthcheck John->John: Fight against hypochondria end Note right of John: Rational thoughts
prevail... John-->Alice: Great! John->Bob: How about you? Bob-->John: Jolly good!
6. 高效绘制甘特图
甘特图内在思想简单。基本是一条线条图,横轴表示时间,纵轴表示活动(项目),线条表示在整个期间上计划和实际的活动完成情况。它直观地表明任务计划在什么时候进行,及实际进展与计划要求的对比。
gantt title 项目开发流程 section 项目确定 需求分析 :a1, 2019-06-22, 3d 可行性报告 :after a1, 5d 概念验证 : 5d section 项目实施 概要设计 :2019-07-05 , 5d 详细设计 :2019-07-08, 10d 编码 :2019-07-15, 10d 测试 :2019-07-22, 5d section 发布验收 发布: 2d 验收: 3d
8. 绘制表格
作品名称 | 在线地址 | 上线日期 |
---|---|---|
倾城之链 | https://nicelinks.site | 2017-09-20 |
晚晴幽草轩 | https://jeffjade.com | 2014-09-20 |
静轩之别苑 | http://quickapp.lovejade.cn | 2019-01-12 |
9. 更详细语法说明
想要查看更详细的语法说明,可以参考这份 Markdown 资源列表,涵盖入门至进阶教程,以及资源、平台等信息,能让您对她有更深的认知。
总而言之,不同于其它所见即所得的编辑器:你只需使用键盘专注于书写文本内容,就可以生成印刷级的排版格式,省却在键盘和工具栏之间来回切换,调整内容和格式的麻烦。Markdown
在流畅的书写和印刷级的阅读体验之间找到了平衡。
目前它已经成为世界上最大的技术分享网站 GitHub
和
技术问答网站 StackOverFlow
的御用书写格式,而且越发流行,正在在向各行业渗透。
最新更新于 2019.08.21