如何优雅地排版微信公众号

为什么要用 Markdown

  大家都知道公众号只支持富文本写作，这就有了很大的限制，尤其对于程序员来说很不友好，不能插入代码成了很多人的痛点。

  而往往你看到的很好看的排版，这也是人家经过了几个小时的选材排版后的结果。虽然市面上也有很多排版网站，如：秀米、135 、365，不否认它们都很优秀，但是要想有一个不错的排版，也是费尽心力。

  而现在有一种只需要关注语法本身，不需要担心排版的 神器 —— Markdown

  Markdown 是一种可以使用普通文本编辑器编写的标记语言，通过简单的标记语法，它可以使普通文本内容具有一定的格式。

  其语法简单易用，富文本能做到的它都能做到，同时又支持 HTML、以及代码插入，很受程序员喜欢。

  Markdown 编辑器

  Markdown 只是一种语法格式，使用它写作，只需要记住简单的几个语法即可。正所谓：工欲善其事必先利其器，你现在还需要一款合适的能够支持 Markdown 语法的编辑器。

  推荐几款比较好用的编辑器：

• Typora：所见即所得，神器，推荐

• VScode：巨硬家族，很棒

• Sublime Text：需要安装插件

• Atom：GitHub 推出，转为程序员设计，很强大

• 简书：一个写作平台

  上面五种编辑器，除了 Typora 与简书以为，其余三种都需要自己配置 Markdown 插件，在这里不在赘述。

Markdown 语法

  标题

# 一级标题
## 二级标题
### 三级标题
...


一级标题

二级标题

三级标题

---

  文本加粗

**文本加粗**

文本加粗

  斜体

*斜体*


斜体

  下划线

<u>下划线</u>

下划线

  删除线

~~删除线~~


删除线

  分割线

***
---
+++

---

---

  文本引用

> 这是一段文本，正在被引用...


这是一段文本，正在被引用…

  链接

[描述](链接地址)
[百度](https://www.baidu.com)

百度

  文本居中

<center>文本居中</center>
<center><font color=grey>文本居中</font></center>        # 指定颜色

文本居中

  换行

<br/>

换行<br/>换行        # 示例

换行
换行

  首行缩进

         # 缩进一个空白（字符）
  首行缩进


  首行缩进

  无序列表

+ 无序列表        # + 与文本之间有空格
- 无序列表
* 无序列表

• 无序列表

• 无序列表

• 无序列表

  有序列表

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


1. 有序列表

2. 有序列表

  复选框

* [x] 第一只青蛙        # 已勾选，* 与 [ ] 之间有空格
* [ ] 第二只青蛙        # 未勾选
* [ ] 第二只青蛙

√第一只青蛙

x第二只青蛙        

x第二只青蛙

  插入图片

![描述](图片链接地址)
![](http://pic3.16pic.com/00/25/17/16pic_2517638_b.jpg)


  代码块

这是`行内代码`，行内代码。

```
代码块
```

这是行内代码，行内代码。

代码块


  表格

|序号|名称|类型|
|---|----|---|
|1  |表格 |Table|

序号	名称	类型
1	表格	Table

Markdown 样式

同样地使用 Markdown 写作，你可能最终看到的效果却不同，这是由于 CSS 样式不同导致的。下图就是不同样式的引用，其表现方式也不同：

  上面这些样式都是引用了别人已经写好的，第一个样式是我在别人的基础上，对其稍作修改，目前自己日常使用。

  推荐几个 CSS 样式：

• 李笑来：https://gist.github.com/xiaolai/aa190255b7dde302d10208ae247fc9f2

• MWeb：https://cdn./MWeb.css

• 阳志平：https://github.com/veganshe/CodeBlock/blob/master/Markdown-here/markdown-here-yzp.css

• 王小杰：https://github.com/veganshe/CodeBlock/blob/master/Markdown-here/markdown-here-veganshe.css

Markdown 样式使用