markDown

463 阅读6分钟

 经常逛掘金,简书,看微信公众号,一直以为是他们的编辑器自带的排版,没想到用到的是markdown
之前就听说mackdown写文档特别的方便,所以今天就来认真的研究一下我们的markdown.

 研究的时候,我发现了两款排版格式工具,不但有简单快速的上手教程还有特别实用又好看。 本文主要参考mdnice 官网,主要用于学习和巩固使用。

  • md2all:  http://md.aclickall.com/
  • mdnice:  https://www.mdnice.com/

注: 想看具体细节的可以去参考mdnice 真的很方便哦~

1 通用语法

1.1 标题

不同数量的#显示不同的标题,如下:

  # 一级标题
  ## 二级标题
  ### 三级标题
  #### 四级标题
  ##### 五级标题
  ###### 六级标题

1.2 无序列表

无序列表的使用,在符号-后加空格使用。如下:


- 无序列表 1
- 无序列表 2
  - 无序列表 2.1
  - 无序列表 2.2
  
  • 无序列表 1
  • 无序列表 2
    • 无序列表 2.1
    • 无序列表 2.2

注:微信最多支持到二级列表

1.3 有序列表

数字及符号.后加空格如下:

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

1.4 引用

符号>后面书写文字。如下:

> 这是引用

这是引用

1.5 粗体和斜体

文字前后各加两个*

文字前后各加一个_

如下:

这个是**粗体**

这个是_斜体_

这个是 **_粗体加斜体_**

这个是粗体

这个是_斜体_

这个是 粗体加斜体

1.6 链接

这是链接[百度](https://www.baidu.com)

这是链接百度

1.7 分割线

三个以上的减号=分隔线,
需要在分隔线的上面空一行。如下:


1.8 删除线

在删除的文字前后各使用两个~,如下:

这是要被~~删除~~的内容。

这是要被删除的内容。

1.9 表格

可以使用冒号来定义表格的对齐方式,如下:

| 姓名        | 年龄 |         工作  |
| :--------- :--: | -----------: |
| 可爱        |  18  |     吃可爱多  |
| 勇敢        |  20  |  爬棵勇敢树   |
| 机智        |  22  | 看一本机智书   |

显示

姓名 年龄 工作
可爱 18 吃可爱多
勇敢 20 爬棵勇敢树
机智 22 看一本机智书

左冒号左对齐,
右冒号右对齐
两个冒号中间放中间

1.10 图片

图片尾部添加宽度和高度控制图片大小,用法如下:

同时设置宽度和高度
同时设置宽度和高度
只设置宽度,推荐使用百分比
只设置宽度,推荐使用百分比

支持 jpg、png、gif、svg 等图片格式,其中 svg 文件仅可在微信公众平台中使用

  • 支持图片拖拽和截图粘贴到编辑器中上传,上传时使用当前选择的图床。
  • 可使用格式->图片上传本地图片,网站目前支持「图壳」图床,失败率低,但是只可保存一天用于排版

注:仅支持 https 的图片,图片粘贴到微信、知乎或掘金时会自动上传其服务器,不必担心使用上述图床会导致图片丢失

图片还可以和链接嵌套使用,能够实现推荐卡片的效果,用法如下:

Markdown Nice图嵌套
Markdown Nice图嵌套

1.11 空格

插入一个空格 (non-breaking space)
         或          或       

插入两个空格 (en space)
          或        或       

插入四个空格 (em space)
         或        或       

插入细空格 (thin space)
        或        或       

注意:不要漏掉分号。

1.12 换行

markdown默认是换行是不会换行的,需要在文字后面打两个空格再打回车键才可以换行。

2. 特殊语法

2.1 脚注

支持平台:微信公众号、知乎。

脚注与链接的区别如下所示:

链接:[文字](链接)
脚注:[文字](脚注解释 "脚注名字")

这是脚注

什么是全栈[1]

脚注内容请拉到最下面观看。

2.2 代码块

引用代码,只要用反引号引起来就好,如下:

Use the `printf()` function.

Use the printf() function.


在需要高亮的代码块的前一行及后一行使用三个反引号,同时第一行反引号后面表示代码块所使用的语言,如下:

    ```JavaScript
    function helloworld(){
        conso.log('你好世界')
    }
    ```

显示

function helloworld(){
    conso.log('你好世界')
}

支持语言种类:

bash
clojure,cpp,cs,css
dart,dockerfile, diff
erlang
go,gradle,groovy
haskell
java,javascript,json,julia
kotlin
lisp,lua
makefile,markdown,matlab
objectivec
perl,php,python
r,ruby,rust
scala,shell,sql,swift
tex,typescript
verilog,vhdl
xml
yaml

diff 不能同时和其他语言的高亮同时显示,且需要调整代码主题为微信代码主题以外的代码主题才能看到 diff 效果,使用效果如下:

    ```diff
    + 新增项
    - 删除项
    ```
+ 新增项
- 删除项

2.3 注音符号。

简直是喜大普奔hē hē hē hē呀!

2.4 横屏滑动幻灯片

支持平台:微信公众号。

通过<![](url),![](url)>这种语法设置横屏滑动滑动片,具体用法如下:

蓝1绿2红3

<<< 左右滑动见更多 >>>

3 其他语法

3.1 HTML

支持原生 HTML 语法,请写内联样式,如下:

<span style="display:block;text-align:right;color:orangered;">橙色居右</span>
<span style="display:block;text-align:center;color:orangered;">橙色居中</span>

显示 橙色居右 橙色居中

4 最后

当你编写完成后,可以选择不同的主题,当然也可以自定义,再选择代码主题。 要发到,微信公众号,知乎,掘金等, 可以选择右侧的两个按钮,复制到微信公众号或者复制到知乎,然后黏贴过去。要保存到本地 文件——导出markdown即可。
同时也可以导入文件,进行编写。

参考资料

[1]

什么是全栈工程师: 是指掌握多种技能,并能利用多种技能独立完成产品的人。

- END -