Markdown 语法介绍
点击预览可以看到效果:
锚点
Coding 会针对每个标题,在解析时都会添加锚点 id,如
# 锚点
会被解析成:
<h1 id="user-content-锚点">锚点</h1>
注意我们添加了一个 user-content- 的前缀,所以如果要自己添加跳转链接要使用 Markdown 的形式,且链接要加一个 user-content- 前缀,如:
[访问链接](#user-content-锚点);
引用
Markdown 标记区块引用和 email 中用 『>』的引用方式类似,只需要在整个段落的第一行最前面加上 『>』 :
> Coding.net 为软件开发者提供基于云计算技术的软件开发平台,包括项目管理,代码托管,运行空间和质量控制等等。
效果图如下:
区块引用可以嵌套,只要根据层次加上不同数量的『>』:
> 这是第一级引用。
>
> > 这是第二级引用。
>
> 现在回到第一级引用。
效果图如下:
引用的区块内也可以使用其他的 Markdown 语法,包括标题、列表、代码区块等:
> ## 这是一个标题。
> 1. 这是第一行列表项。
> 2. 这是第二行列表项。
>
> 给出一些例子代码:
>
> return shell_exec(`echo $input | $markdown_script`);
效果图如下:
列表
列表项目标记通常放在最左边,项目标记后面要接一个字符的空格。
无序列表:使用星号、加号或是减号作为列表标记
- Red
- Green
- Blue
效果图如下:
有序列表:使用数字接着一个英文句点
1. Red
2. Green
3. Blue
效果图如下:
如果要在列表项目内放进引用,那『>』就需要缩进:
* Coding.net有以下主要功能:
> 代码托管平台
> 在线运行环境
> 代码质量监控
> 项目管理平台
效果图如下:
代办列表: 表示列表是否勾选状态(注意:[ ] 前后都要有空格)
- [ ] 不勾选
- [x] 勾选
效果图如下:
代码
只要把你的代码块包裹在 “` 之间,你就不需要通过无休止的缩进来标记代码块了。 在围栏式代码块中,你可以指定一个可选的语言标识符,然后我们就可以为它启用语法着色了。 举个例子,这样可以为一段 Ruby 代码着色:
“`ruby
require ‘redcarpet’
markdown = Redcarpet.new(“Hello World!”)
puts markdown.to_html
效果图如下:
强调
在Markdown中,可以使用 * 和 _ 来表示斜体和加粗。
斜体:
*Coding,让开发更简单*
_Coding,让开发更简单_
效果图如下:
加粗:
**Coding,让开发更简单**
__Coding,让开发更简单__
效果图如下:
自动链接
方括号显示说明,圆括号内显示网址, Markdown 会自动把它转成链接,例如:
[超强大的云开发平台Coding](http://coding.net)
效果图如下:
表格
在 Markdown 中,可以制作表格,例如:
First Header | Second Header | Third Header
------------ | ------------- | ------------
Content Cell | Content Cell | Content Cell
Content Cell | Content Cell | Content Cell
效果图如下:
或者也可以让表格两边内容对齐,中间内容居中,例如:
First Header | Second Header | Third Header
:----------- | :-----------: | -----------:
Left | Center | Right
Left | Center | Right
效果图如下:
分割线
在 Markdown 中,可以使用 3 个以上『-』符号制作分割线,例如:
这是分隔线上部分内容
---
这是分隔线上部分内容
效果图如下:
图片
Markdown 使用了类似链接的语法来插入图片, 包含两种形式: 内联 和 引用.
内联图片语法如下:
![Alt text](/path/to/img.jpg) 或 ![Alt text](/path/to/img.jpg "Optional title")
也就是:
- 一个惊叹号『!』
- 接着一个方括号,里面是图片的替代文字
- 接着一个普通括号,里面是图片的网址,最后还可以用引号包住并加上 选择性的『title’』文字。
引用图片语法如下:
![Alt text][id]
『id』 是图片引用的名称. 图片引用使用链接定义的相同语法:
[id]: url/to/image "Optional title attribute"
流程图
Markdown 编辑器已支持绘制流程图、时序图和甘特图。通过 mermaid 实现图形的插入,点击查看 更多语法详情。
```graph graph TD; A-->B; A-->C; B-->D; C-->E; E-->F; D-->F; F-->G; ```
效果图如下:
时序图
```graph 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!```
效果图如下:
甘特图
```graph gantt dateFormat YYYY-MM-DD title Adding GANTT diagram functionality to mermaid section A section Completed task :done, des1, 2014-01-06,2014-01-08 Active task :active, des2, 2014-01-09, 3d Future task : des3, after des2, 5d Future task2 : des4, after des3, 5d section Critical tasks Completed task in the critical line :crit, done, 2014-01-06,24h Implement parser and jison :crit, done, after des1, 2d Create tests for parser :crit, active, 3d Future task in critical line :crit, 5d Create tests for renderer :2d Add to mermaid :1d ```
效果图如下:
</div>
</article>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/faq/project/setting.html" title="项目常见问题">项目常见问题</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
12834</li>
</ul>
<!-- /.hkb-meta -->
</li>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/faq/project/tasks.html" title="项目任务常见问题">项目任务常见问题</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
7364</li>
</ul>
<!-- /.hkb-meta -->
</li>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/faq/project/files-2.html" title="项目文件常见问题">项目文件常见问题</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
8055</li>
</ul>
<!-- /.hkb-meta -->
</li>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/doc/project/workbench" title="工作台及待办事项">工作台及待办事项</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
175</li>
</ul>
<!-- /.hkb-meta -->
</li>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/doc/project/public-project.html" title="Coding.net 公开与私有项目融合,界面全新升级,并新增公开源代码功能">Coding.net 公开与私有项目融合,界面全新升级,并新增公开源代码功能</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
11961</li>
</ul>
<!-- /.hkb-meta -->
</li>
<li class="xianguanwenzhang hkb-article-list__format-standard">
<a href="https://coding.net/help/doc/project/team.html" title="团队功能(已下线)">团队功能(已下线)</a>
<!-- .hkb-meta -->
<ul class="hkb-meta">
<li class="hkb-meta__views">
7008</li>
</ul>
<!-- /.hkb-meta -->
</li>
</ul>
</section>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/account/index.html">用户账户常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/git/git.html">Git 操作常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/git/repository.html">代码仓库常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/project/setting.html">项目常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/project/tasks.html">项目任务常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/project/files-2.html">项目文件常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/webide/index.html">WebIDE 常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/faq/mobile/index.html">移动端常见问题</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/doc/notice">【公告】CODING 个人版用户权益升级和功能调整</a>
</li>
<li class="hkb-widget-article__format-standard">
<a class="hkb-widget__entry-title" href="https://coding.net/help/git/ssh-key-existed.html">添加公钥时,提示「公钥已存在」怎么办?</a>
</li>
</ul>
</section><section id="ht-kb-categories-widget-4" class="widget hkb_widget_categories clearfix"><h4 class="widget-title">帮助文档目录</h4><ul class="hkb_category_widget__category_list"> <li class="cat-item cat-item-3"><a href="https://coding.net/help/doc/coding-service">CODING 服务介绍</a>
jQuery(document).ready(function (){
jQuery('#topic-search-input').keypress(function (e) {
if (e.which == 13) {
var input = jQuery('#topic-search-input');
window.open("https://coding.net/search?type=topic&project=Coding-Feedback&user=coding&q=" + input.val());
return false;
}
});
})