[TOC] >[danger] 为了确保编辑功能的完整体验,请尽量避免使用包括IE和Edge在内的浏览器进行在线编辑。 看云使用了独立开发的`MarkDown`编辑器,其语法规范兼容标准的`MarkDown`语法,基本用法介绍如下: ## H1~H6 选中内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/a35bf8815366c789bb804e06ad2bb8b3_144x34.png) 或者使用 `CTRL+1` ~ `CTRL+6` 快捷键。 示例效果: ~~~ # H1文字 ## H2文字 ### H3文字 #### H4文字 ##### H5文字 ###### H6文字 ~~~ ![2015-05-19/555b342f727ca](http://box.kancloud.cn/2015-05-19_555b342f727ca.png) ## 粗体 选择内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/c7fe0624364675d738556b792597ca92_37x34.png) 或者使用 `CTRL+B` 快捷键。 示例效果: ~~~ **粗体内容** ~~~ **粗体内容** ## 斜体 选择内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/2701336414b5a8c949935b9a8cc32cb7_33x31.png) 或者使用 `CTRL+I` 快捷键。 示例效果: ~~~ _斜体内容_ ~~~ _斜体内容_ ## 无序列表 选择多行内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/dfebeb21f5e5f8cc5279f2b1fc793b9d_34x34.png) 或者使用 `CTRL+ALT+U` 快捷键。 示例效果: ~~~ * 列表项1 * 列表项2 * 列表项3 * 列表项4 ~~~ * 列表项1 * 列表项2 * 列表项3 * 列表项4 支持使用多级列表: ~~~ * 列表项1 * 列表项2 * 子列表项1 * 子列表项2 ~~~ * 列表项1 * 列表项2 * 子列表项1 * 子列表项2 ## 有序列表 选择多行内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/ee415ccbd96990728e1552a7a78cc789_32x30.png) 或者使用 `CTRL+ALT+O` 快捷键。 示例效果: ~~~ 1. 列表项1 2. 列表项2 3. 列表项3 4. 列表项4 ~~~ 1. 列表项1 2. 列表项2 3. 列表项3 4. 列表项4 支持使用多级列表: ~~~ 1. 列表项1 2. 列表项2 1. 子列表项1 2. 子列表项2 ~~~ 1. 列表项1 2. 列表项2 1. 子列表项1 2. 子列表项2 ## 任务列表 可以定义任务列表(包括无序列表和有序列表),直接点击编辑器工具栏的 ![](https://box.kancloud.cn/18e93f299f63da4f83f8cd327b57c6d1_34x29.png) 或者使用 `CTRL+ALT+T`快捷键,并且一样支持多级,格式如下: ~~~ * [ ] 代办事项1 * [ ] 代办事项2 * [x] 完成事项3 * [x] 完成事项4 ~~~ * [ ] 代办事项1 * [ ] 代办事项2 * [x] 完成事项3 * [x] 完成事项4 ~~~ 1. [ ] 代办事项1 2. [ ] 代办事项2 1. [x] 完成事项3 2. [x] 完成事项4 ~~~ 1. [ ] 代办事项1 2. [ ] 代办事项2 1. [x] 完成事项3 2. [x] 完成事项4 ## 链接 选择要添加链接的内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/1ab256f9a9de51eb058521e9d65985b5_33x31.png) 或者使用 `CTRL+L` 快捷键。 示例效果: ~~~ [链接文字](http://www.kancloud.cn) ~~~ [链接文字](http://www.kancloud.cn) >[info] 还有一种简单的方式可以直接输入一个规范的链接地址,会自动识别为链接,而无需使用markdown链接规范。 ~~~ 看云的网址是:http://www.kancloud.cn ~~~ 看云的网址是:http://www.kancloud.cn > 网址前后加上空格可以避免混淆 上述写法中链接地址中不能含有括号,如果你的链接地址中带有括号的话,可以使用下面的方式: > ~~~ > [链接文字] [1] > 这里可以添加任何内容 > 然后在页面的任意位置添加如下: > [1]: http://www.kancloud.cn/test_address > ~~~ 如果要添加内链地址,可以直接把链接地址写成版本库的文件地址,例如: ~~~ [写作规范](写作规范.md) ~~~ [写作规范](建议规范.md) 支持直接拖动左边的目录当当前页面的光标位置直接插入。 ## 脚注 可以给内容添加脚注功能,例如: ~~~ 看云是一个文档写作[^write]和托管平台[^platform]。 // 中间可以添加其他内容 [^write]: 写作格式采用Markdown格式,支持版本和多人写作。 [^platform]: 发布的文档可以直接在平台阅读、分享和私有存储,并支持付费阅读。 ~~~ >[info] 通常可以把脚注的内容解释统一放到页面最后。 脚注的链接效果如下: 看云是一个文档写作[^write]和托管平台[^platform]。 [^write]: 写作格式采用Markdown格式,支持版本和多人写作。 [^platform]: 发布的文档可以直接在平台阅读、分享和私有存储,并支持付费阅读。 ## 图片 有二种方式可以添加图片: 1. 点击编辑器工具栏上的 ![](https://box.kancloud.cn/ac689ca486af8eb6d32f08ce6fd048a6_34x30.png) 或者使用 `CTRL+ALT+Y` 快捷键 弹出文件上传选择框后点击上传需要的图片文件即可。 2. 复制网页上的图片或者直接截屏操作后在编辑器中进行粘贴操作,图片也会自动上传到当前光标位置显示,如果你选择了某段文字后粘贴的话,该段内容会作为图片的ALT信息显示。 所以,在创作文档的时候,你可以根据你的需要采用不同的方式上传图片。 > 关于设置图片大小:默认图片是自适应显示的,如果需要设置图片文件的大小可以使用 ~~~ ![](https://box.kancloud.cn/36b63669cdf9a2879646b217dba405ef_100x100.png) ![](https://box.kancloud.cn/36b63669cdf9a2879646b217dba405ef_100x100.png =50x50) ~~~ 示例: ![](https://box.kancloud.cn/36b63669cdf9a2879646b217dba405ef_100x100.png) ![](https://box.kancloud.cn/36b63669cdf9a2879646b217dba405ef_100x100.png =50x50) > 如果上传了非图片文件,将无法显示 ## 外部图床 支持使用外部云存储来保存图片,这样不会占用看云本身的文档空间,但需要注意会影响打包的性能(如果外部图片较多的情况下 可能会打包失败),但在线阅读不受任何影响。 打开插件管理后,添加云图片插件 ![](https://box.kancloud.cn/095e44c3a11852268177e30856af1793_263x106.png) 刷新页面后再次打开插件管理页面,在已安装页面找到云图片插件后点击设置按钮 ![](https://box.kancloud.cn/bd9578ec7dff2b76c2d73edca9d194ac_548x372.png) 在插件设置页面选择七牛或者又拍云,然后设置相关的key(参考七牛或者又拍云的文档),确定后就可以把图片直接传到指定的云存储了。 ![](https://box.kancloud.cn/179e08fb84d7e6e2acb0aa2eeea41488_707x517.png) >[danger] 注意:如果安装了云图片插件后必须及时设置好存储参数,否则会导致所有图片都不能上传。 ## 代码 选择代码段落后后按编辑器工具栏上的 ![](https://box.kancloud.cn/7093186f78fb076ae9024407d5618cc8_32x30.png) 或者使用 `CTRL+E` 快捷键。 示例效果: ~~~ 单行代码 `define('APP_DEBUG', false);` ~~~ 单行代码 `define('APP_DEBUG', false);` ``` 多行代码: ~~~ // 系统常量定义 defined('THINK_PATH') or define('THINK_PATH', __DIR__.'/'); defined('APP_PATH') or define('APP_PATH', dirname($_SERVER['SCRIPT_FILENAME']).'/'); defined('APP_STATUS') or define('APP_STATUS', ''); // 应用状态 加载对应的配置文件 defined('APP_DEBUG') or define('APP_DEBUG', false); // 是否调试模式 ~~~ ``` >[info] 注意:多行代码标签前面不能有空白,后面必须换行。 多行代码: ~~~ // 系统常量定义 defined('THINK_PATH') or define('THINK_PATH', __DIR__.'/'); defined('APP_PATH') or define('APP_PATH', dirname($_SERVER['SCRIPT_FILENAME']).'/'); defined('APP_STATUS') or define('APP_STATUS', ''); // 应用状态 加载对应的配置文件 defined('APP_DEBUG') or define('APP_DEBUG', false); // 是否调试模式 ~~~ > 系统的快捷键操作如果选择的是单行就是单行代码效果,如果选择多行就自动采用多行代码显示。 可以指定代码使用的语言,例如: ``` 多行代码: ~~~php // 系统常量定义 defined('THINK_PATH') or define('THINK_PATH', __DIR__.'/'); defined('APP_PATH') or define('APP_PATH', dirname($_SERVER['SCRIPT_FILENAME']).'/'); defined('APP_STATUS') or define('APP_STATUS', ''); // 应用状态 加载对应的配置文件 defined('APP_DEBUG') or define('APP_DEBUG', false); // 是否调试模式 ~~~ ``` ## 分割线 点击编辑器工具栏上的 ![](https://box.kancloud.cn/fee729232479f4882666ca8274ae287c_28x30.png) 或者使用 `CTRL+H` 用于插入一条分割线。 示例效果: ~~~ * * * * * ~~~ * * * * * ## 引用 选择内容后按编辑器工具栏上的 ![](https://box.kancloud.cn/177faab4805e02ff98ed3b5dd225a50b_33x30.png) 或者使用 `CTRL+Q` 快捷键。 示例效果: ~~~ > 这是一段引用内容文字 > 这是第二行引用内容文字 > 这是第三行引用内容文字 ~~~ > 这是一段引用内容文字 > 这是第二行引用内容文字 > 这是第三行引用内容文字 在引用内容中还可以使用部分其他的格式,例如: ~~~ > 这是一段引用内容文字 **粗体内容** > 这是第二行引用内容文字 _斜体内容_ > 这是第三行引用内容文字 `单行代码` > [这是一个链接](http://www.kancloud.cn) ~~~ > 这是一段引用内容文字 **粗体内容** > 这是第二行引用内容文字 _斜体内容_ > 这是第三行引用内容文字 `单行代码` > [这是一个链接](http://www.kancloud.cn) 支持多级引用,例如: ~~~ > 引用内容 > > > 子引用内容 > > 子引用内容 ~~~ > 引用内容 > > > 子引用内容 > > 子引用内容 **引用样式支持** 可以通过引用样式对引用内容进行特别的强调,目前支持四种引用样式,分别是: info: ~~~ >[info] 这里是**提示信息** >通常用于一些提醒事项 ~~~ >[info] 这里是**提示信息** >通常用于一些提醒事项 warning: ~~~ >[warning] 这里是**警告信息** >通常用于一些警告事项 ~~~ >[warning] 这里是**警告信息** >通常用于一些警告事项 success: ~~~ >[success] 这里是**成功信息** >通常用于一些成功提示 ~~~ >[success] 这里是**成功信息** >通常用于一些成功提示 danger: ~~~ >[danger] 这里是**危险信息** >需要引起特别的注意 ~~~ >[danger] 这里是**危险信息** >需要引起特别的注意 ## 段落排版 支持段落的居左、居中和居右排版,选中段落内容后点击工具栏上面的 ![](https://box.kancloud.cn/757f88555ae3ced7c0ca5d97ee0df8dc) 按钮就可以对段落进行居左(`CTRL+ALT+L`)、居中(`CTRL+ALT+E`)和居右(`CTRL+ALT+R`)排版了。 并且也支持图片和引用段落的排版。 示例: ~~~txt 这是一个居左的段落 :-: 这是一个居中的段落 --: 这是一个居右的段落 >[info] --: 这里是居右的引用内容 :-: ![](https://box.kancloud.cn/cover_2015-07-17_55a8b9187bde_800x1068.jpg-bookmiddle) :-: 图片居中 ~~~ 这是一个居左的段落 :-: 这是一个居中的段落 --: 这是一个居右的段落 >[info] --: 这里是居右的引用内容 :-: ![](https://box.kancloud.cn/cover_2015-07-17_55a8b9187bde_800x1068.jpg-bookmiddle) :-: 图片居中 ## 注释 支持使用段落注释,只在编辑的时候可见,阅读的时候不可见,必须顶格使用`//` + 空格(或者选中内容后使用快捷键 `CTRL+/`) ~~~ // 这是一个注释内容 注释段落内容 这个段落是可见的 ~~~ ## 表格 点击工具栏上的 ![](https://box.kancloud.cn/1717f2da7b6c7acb3841c0c261324767_35x33.png) 按钮输入表格的行列数然后手动插入表格的单元项。 ![](https://box.kancloud.cn/7958d078e5e956a0ea8bbf8943fb4813_742x346.png) 示例效果: ~~~ | 编号 | 产品 | 描述 | |---|---|---| | 1 | ThinkPHP | 开源WEB应用框架 | | 2 | OneThink | 开源内容管理框架 | | 3 | 看云 | 文档托管平台 | ~~~ | 编号 | 产品 | 描述 | |---|---|---| | 1 | ThinkPHP | 开源WEB应用框架 | | 2 | OneThink | 开源内容管理框架 | | 3 | 看云 | 文档托管平台 | 支持对单元列设置对齐方式,例如: ~~~ | 编号(居右对齐) | 产品(居中对齐) | 描述(居左对齐) | | ---: | :---: | :--- | | 1 | ThinkPHP | 开源WEB应用框架 | | 2 | OneThink | 开源内容管理框架 | | 3 | 看云 | 文档托管平台 | ~~~ | 编号(居右对齐) | 产品(居中对齐) | 描述(居左对齐) | | ---: | :---: | :--- | | 1 | ThinkPHP | 开源WEB应用框架 | | 2 | OneThink | 开源内容管理框架 | | 3 | 看云 | 文档托管平台 | > 注:markdown规范不支持复杂的表格,如果需要,可以自行粘贴表格的HTML代码,可以直接显示。 ## 数学公式 看云支持在内容中插入数学公式,但需要设置使用`tex`插件,在编辑模式下面打开右上角的插件管理,添加数学公式插件: ![](https://box.kancloud.cn/1921d14236d1bdc8a242f5dce7303b03_220x261.png) ![](https://box.kancloud.cn/109c80f76ba34426a91f91b465e0498f_273x113.png) 然后,你就可以直接在编辑区输入公式定义,例如: 单行公式: ~~~ `$ c = \pm\sqrt{a^2 + b^2} $` ~~~ 支持多行的写法 多行的公式会居中显示 如: ~~~ ```[tex] f(x) = \int_{-\infty}^\infty \hat f(\xi)\,e^{2 \pi i \xi x} \,d\xi ``` ~~~ 实际效果如图: ![document/2015-10-05/56126f27bd91b](http://box.kancloud.cn/document_2015-10-05_56126f27bd91b.png) ## 流程图和时序图 支持在文档中直接插入和编辑流程图及时序图,只需要使用`flow`和`sequence`插件,在编辑模式下面打开右上角的插件管理,添加: ![](https://box.kancloud.cn/0c922e6c4a026f8a8899e272f4306961_861x495.png) 然后在文档中使用下面的方式添加流程图和时序图即可。 流程图: ~~~ ```[flow] st=>start: Start:>http://www.google.com[blank] e=>end:>http://www.google.com op1=>operation: My Operation sub1=>subroutine: My Subroutine cond=>condition: Yes or No?:>http://www.google.com io=>inputoutput: catch something... st->op1->cond cond(yes)->io->e cond(no)->sub1(right)->op1 ``` ~~~ 效果如图所示: ![](https://box.kancloud.cn/2e3a1053e0a65bea086342cbea141114_351x478.png) 时序图: ~~~ ```[sequence] Title: Here is a title A->B: Normal line B-->C: Dashed line C->>D: Open arrow D-->>A: Dashed open arrow ``` ~~~ 实际效果如图: ![](https://box.kancloud.cn/e32566701b979c8e392d086ad57663e2_379x302.png) ## 视频 可以支持插入视频内容(目前仅支持插入优酷视频),需要使用`youku`插件,在编辑模式下面打开右上角的插件管理,添加优酷视频插件: ![](https://box.kancloud.cn/3e73c3b65ac374220d8037bc6e0ef300_270x106.png) 刷新页面后可以在工具栏看到 ![](https://box.kancloud.cn/bfc09afb3442c835da07bd3a03ee4abf_34x31.png) 按钮,点击弹出 ![](https://box.kancloud.cn/11282891f3dbc21eec3eb97559b4249c_720x415.png) 把你的优酷视频地址或者ID直接粘贴过来就可以了,如果设置了视频密码的话,还可以设置免密码播放(需要用户开通视频私密托管服务)。 ## 转义符 如果你需要输入一些特殊的符合,但又不希望被用于Markdown标签解析,那么可以使用转义符,Markdown支持以下这些符号前面加上反斜杠来帮助插入普通的符号: ~~~ \ 反斜线 ` 反引号 * 星号 _ 底线 {} 花括号 [] 方括号 () 括弧 # 井字号 + 加号 - 减号 . 英文句点 ! 惊叹号 ~~~ 例如: ~~~ \*看云文档托管平台\* \_看云文档托管平台\_ \#\# 看云文档托管平台 ~~~ \*看云文档托管平台\* \_看云文档托管平台\_ \#\# 看云文档托管平台 ## HTML粘贴 允许在编辑器中直接插入拷贝的HTML内容,点击编辑器工具栏上的 ![](https://box.kancloud.cn/4ecb04829477df0613f7687a62746698_31x31.png) 会弹出 ![](https://box.kancloud.cn/6cac2aa76297e4e7daa0c7b9db390914_910x504.png) 把HTML内容粘贴过来后 点击确定。 ## 目录导航 可以在当前内容中插入(当前内容页的)目录导航,点击编辑器工具栏上的 ![](https://box.kancloud.cn/8296d7955a09fdb68b9aebd890e4eede_32x30.png) 按钮会在光标位置插入 `[TOC]` ,在右侧预览区就可以看到会自动提取当前内容的目录结构。 > 注意:`[TOC]` 后面必须增加一个空行才能正确显示目录结构。 默认情况下 `[TOC]` 在页面解析的时候会自动提取当前页面中的所有`H1~H6`的内容作为目录展示(包含层次关系),如图所示: ![document/2015-09-08/55eeba371284a](http://box.kancloud.cn/document_2015-09-08_55eeba371284a.png) 如果你希望定制目录的层级显示,例如只希望提取部分内容作为目录显示,可以使用: ~~~ [TOC=2] // 提取H1到H2的内容显示 [TOC=3] // 提取H1到H3的内容显示 [TOC=2,3] // 提取H2到H3的内容显示 ~~~ ## 撤销和重做 在编辑内容的过程中可以使用`CTRL+Z`和`CTRL+Y`快捷键或者点击编辑器工具栏上的 ![](https://box.kancloud.cn/5960c138a30e056754c2faf8d2b8687d_69x35.png) 进行撤销和重做操作。 ## 全文预览 文档在没有发布之前,其它用户是无法阅读的,但作者或者文档成员中具有编辑以上权限的用户(包括创始人、管理员和编辑)可以进行预览操作。 点击右上角的全文预览按钮 ![](https://box.kancloud.cn/8817dfd3aab73ffe4f78e1e089a7e614_41x33.png)可以进行和最终阅读效果一致的全文预览。 ## 编辑器显示设置 在编辑器界面的右下角有一个设置按钮 ![](https://box.kancloud.cn/b1c8d556e1e2237ef9515162efa14e52_62x48.png) ,点击该按钮可以设置是否显示预览和目录栏。如果你的分辨率比较低,可以设置关闭自动预览显示,然后在写完后使用右上角的全文预览。 ![](https://box.kancloud.cn/1ed1f5d43a029407a8b8da58712dae82_163x233.png) ## 同步内容 编辑过程中不需要进行保存操作,系统会自动保存到该文档的暂存区,只有在点击同步操作的时候才会实际提交到版本库,如果需要同步内容,可以随时点击编辑器工具栏上的 ![](https://box.kancloud.cn/6b3d046f47bf55d2f73b730265493468_40x38.png) 。 默认情况下该按钮呈灰色状态![](https://box.kancloud.cn/2fa709c0f24f3bad5349aa484640db96_37x34.png) ,当有内容更新后,会自动显示为 ![](https://box.kancloud.cn/6b3d046f47bf55d2f73b730265493468_40x38.png) 说明这个时候可以进行同步操作。