markdown学习

29 Aug 2016 markdown学习

最早接触markdown是在github参与翻译一本开源电子书,在查看别人翻译完的内容时,会发现一些奇怪的字符。比如:

## 第一章

- 第一节

`os.Open()`

当时很好奇,为什么会使用这些字符,最后在github上查看翻译好的章节时,才知道这是一种标记语言的语法,通过在文档中的某部分加入特殊的字符,用来修饰文档中的文本,这就是markdown,一种轻量级标记语言。

使用markdown一段时间以后,才发现markdown原来那么有用,比如:

其实markdown的语法并不复杂,常用语法花十几分钟即可掌握,于是总结了markdown的基本语法,分享给大家。

1 加粗

如果需要加粗显示某些内容,可以使用以下语法:

**这是粗体**

效果如下:

这是粗体

2 斜体

如果需要斜体显示某些内容,可以使用以下语法:

*这是协体*

效果如下:

这是斜体

3 删除

如果需要删除某些内容,可以使用以下语法:

~~这是删除~~

效果如下:

这是删除

4 下划线

如果需要添加下划线,可以使用以下语法:

++这是下划线++

效果如下:

++这是下划线++

5 标题

如果需要以标题形式显示某些内容,可以使用以下语法:

# 这是一级标题

## 这是二级标题

### 这是三级标题

#### 这是四级标题

效果如下:

这是一级标题

这是二级标题

这是三级标题

这是四级标题

6 水平线

如果需要分割线,可以使用以下语法:

---

效果如下:


或者使用三个星号***也可以,效果如下:


7 引用

如果需要引用某些内容,可以使用以下语法:

> 这是引用

效果如下:

这是引用

8 列表

如果需要以列表形式显示某些内容,可以使用以下语法:

8.1 无序列表

- 这是无序列表1
- 这是无序列表2
- 这是无序列表3

8.2 有序列表

1. 这是有序列表1
2. 这是有序列表2
3. 这是有序列表3

效果分别如下:

  • 这是无序列表1
  • 这是无序列表2
  • 这是无序列表3
  1. 这是有序列表1
  2. 这是有序列表2
  3. 这是有序列表3

9 待办事项

如果需要标记某些待办事项,可以使用以下语法:

- [ ] 未完成的事项1
- [ ] 未完成的事项2
- [x] 已完成事项1
- [x] 已完成事项2

效果如下:

  • 未完成的事项1
  • 未完成的事项2
  • 已完成事项1
  • 已完成事项2

10 插入链接

如果需要插入链接,可以使用以下语法:

[这是链接](http://note.youdao.com/)

效果如下:

这是链接

11 插入图片

如果需要插入图片,需要给出图片的链接,然后可以使用以下语法:

![image](https://upload.wikimedia.org/wikipedia/commons/thumb/4/48/Markdown-mark.svg/208px-Markdown-mark.svg.png)

效果如下:

12 插入代码

如果需要插入代码,可以使用以下语法:

```
package main

import "fmt"

func main() {
    fmt.Println("Hello, World!")
}
```

效果如下:

package main

import "fmt"

func main() {
    fmt.Println("Hello, World!")
}

13 插入表格

如果需要插入表格,可以使用以下语法:

```
header 1 | header 2
---|---
row 1 col 1 | row 1 col 2
row 2 col 1 | row 2 col 2

```

效果如下:

header 1

header 2

row 1 col 1

row 1 col 2

row 2 col 1

row 2 col 2

14 插入数学公式

如果需要插入数学公式,可以使用以下语法:

```math
E = mc^2
```

15 插入流程图

如果需要插入流程图,可以使用以下语法:

```
graph LR
A-->B
B-->C
B-->D
```

16 插入序列图

如果需要插入序列图,可以使用以下语法:

```
sequenceDiagram
Client->>Server: How are you?
Server->>Client: Great!
```

效果如下:

17 插入甘特图

如果需要插入甘特图,可以使用以下语法:

```
gantt
dateFormat YYYY-MM-DD
section S1
T1: 2014-01-01, 9d
section S2
T2: 2014-01-11, 9d
section S3
T3: 2014-01-02, 9d
```

总结

其实在工作中使用markdown时,我很少使用它的画图功能,我还是习惯使用visio画图,由于图形显示需要特殊支持,所以上面有些图形显示的例子没有给出效果图,也许是微信公众号后台不支持markdown图形预览(或者是我不会orz),我更多的是使用一些修饰标记符号,如标题、加粗、引用、插入代码等功能,对于markdown的编辑工具选择,我一般是使用sublime+有道云笔记,推荐在sublime编辑好文本后,复制到有道云笔记看效果,虽然sublime借助插件也可以预览markdown文本,但效果不是很佳,使用sublime是因为写代码就使用它,已经习惯它的各种快捷键和编辑方式。尤其多行编辑,实在太方便了。有时间给大家分享sublime的一些使用心得和插件,本次分享就到这了。

LEo at 21:51

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端知识铺

将你的 Virtual dom 渲染成 Canvas

一个基于Vue的virtual dom插件库,按照Vue render 函数的写法,直接将Vue生成的Vnode渲染到canvas中。支持常规的滚动操作和一些基...

26540
来自专栏前端真相

HTML

24280
来自专栏vue学习

介绍-vuejs官网学习笔记

       前言:这两天把vuejs官方文档都看了一遍(路由的文档还没看),现在回过头来再结合英文文档重新看一遍 ,为的是学下英文,然后总结性的写一下。尽管...

29130
来自专栏彭湖湾的编程世界

【响应式】foundation栅格布局的“尝鲜”与“填坑”

提到响应式,就不得不提两个响应式框架——bootstrap和foundation。在标题上我已经说明白啦,今天给大家介绍的是foundation框架。 何为“尝...

413110
来自专栏进步博客

纯CSS实现响应式表格

自从转岗至腾讯云后,项目中接触到大量的数据表格。多列数据表格在空间有限的手机屏幕下,难以完美呈现,需要做响应式处理。本文介绍一种使用纯CSS实现响应式表格的方法...

22720
来自专栏木子墨的前端日常

vue中mixin的一点理解

  vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixin...

27020
来自专栏前端探索

理解 React Hooks

Sophie Alpert 和 Dan Abramov 在 React Conf 2018 中 提出了 hooks 这个概念,让我们一起来看看 Hooks 在解...

2.3K140
来自专栏河湾欢儿的专栏

移动端常用的meta总结

声明viewport视口 viewport对于移动端设备来说非常的重要,用于定义视口的各种行为。其中最为重要的就是要设定一个展示页面的宽度width=devi...

12130
来自专栏hightopo

基于 HTML5 WebGL 的 3D SCADA 主站系统

21030
来自专栏13blog.site

Markdown语法讲解及MWeb使用教程

写了一个月的博客,忽然感觉Markdown编辑器比较好用,于是就下载了一个本地的Markdown编辑软件学习了一下,刚好软件里自带了一篇英文的指示文档,顺便翻译...

31640

扫码关注云+社区

领取腾讯云代金券